文档说明：本文档阶段性更新，可能会长期更新，但是链接不变，如果需要可及时跟进本文档进度。
系统说明：本系统开发分两个阶段
- 校园网阶段：开发调试在校园网范围内可访问，每次ip会变，供内部人员或其他测试人员使用。
- 公网阶段：发布到公网内，ip固定，域名固定，可稳定使用
系统模块划分
模块可能会随着系统的开发发生变动
- 登录模块
用户在登录页面可以输入用户名和密码，点击登录即可进行登录。
需要限制用户名的长度，密码md5加密之后传给后台，不允许用户名和密码出现空格。 - 注册模块
用户输入用户名和密码，点击注册即可进行注册。
要求同上，后台判断用户名是否重复。 - 信息列表
获取最新的信息列表，显示昵称，时间，内容等 - 发布信息
输入框，发送 - 评论功能
对一个信息新增评论 - 详情页面
显示详情，显示详细的评论
开发要求
-
java环境
具体java配置见如下链接的前半部分
https://www.jianshu.com/p/eea5ea8a18d6
或者去官网下载合适版本
https://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html
image.png
java需要按照教程按步骤配置 -
eclipse for java ee
具体见如下链接的后半部分
https://www.jianshu.com/p/eea5ea8a18d6
或者去官网找最新版本
https://www.eclipse.org/downloads/packages/
image.png
eclipse是不用安装的，下载到合适的位置，解压即可，打开文件夹会找到eclipse.exe -
tomcat
去官网下载8.5版本
https://tomcat.apache.org/download-80.cgi
image.png
tomcat是不用安装的，下载到合适的位置，解压，看到有bin、webapp等文件夹即可 -
注册github，下载并安装github客户端
克隆项目
image.png
image.png
url处填仓库地址https://github.com/zuozhiwei/HebutChat.git
可以选择合适的位置，下载到合适的位置，里面包含一个eclipse的项目
打开项目和基本配置
- 打开eclipse.exe
-
导入项目
image.png
image.png
image.png
image.png
image.png
这时已正确导入项目
- 更改eclipse和项目的编码
详见如下链接
https://www.jianshu.com/p/c62bc3589b9a -
eclipse 添加tomcat server
image.png
image.png
在这里是所有的服务器列表，右键来新建一个
image.png
image.png
image.png
image.png
找到解压后的tomcat路径
此时已经添加了tomcat服务器 -
设置项目的库
image.png
image.png
关注以上两项，java和tomcat
如果这两项后面有unbound字样，则需要做以下操作
如果某一项有unbound则选中，然后点remove
image.png
然后再点添加库
image.png
image.png
缺哪个加哪个
如果是java则
image.png
如果是tomcat则
image.png
此时项目应该不会报错 -
运行项目
image.png
数据库安装与配置
- 这里为了方便，直接安装了wamp，里面包含了mysql
https://pan.baidu.com/s/1qWpvRXwO21PI_kJgXXOmdg
提取码risf
启动之后图标变绿即成功打开
安装mysql的可视化软件
参考以下教程中的二 和 三
https://www.jianshu.com/p/f8f422a6c04c连接到本地数据库
默认无密码登录，打开navicat或者workbench新建数据库，新建表
数据库设计
到这里wamp已经安装成功，打开navicat或者workbench开始设计数据库
我使用navicat，打开navicat
-
建立本地连接
打开navicat
本地连接 -
新建数据库
新建数据库
新建数据库
新建表
新建表
新建表
新建表
新建表
image.png
image.png
image.png
image.png
设计数据表和编辑数据表之后直接保存即可
代码首次连接数据库
通过上面的工作，我们已经创建了javaee项目，可以运行java网站项目，设计好了数据库，现在可以在代码里尝试连接数据库
-
java连接mysql数据需要引入一个辅助类 jdbc，需要下载jdbc的jar包，这里我下载好导入到项目中，提交git，大家更新就好
主要操作就是去百度一个jdbc mysql的jar包，复制到lib目录里
image.png -
新建数据库操作类，连接mysql数据库
新建sql的包，新建Sql.java
image.png
image.png
写连接函数
image.png
image.png
为方便开发，我们使用服务器上的数据库，这样可以保持数据一致，大家可以仿照连接本地数据库的方式来连接远程数据库
image.png
第一个例子
- 在页面中添加按钮，来显示数据库用户表里面的所有姓名
在index.jsp里添加a标签
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>第一个例子</title>
</head>
<body>
<!-- 提交的form -->
<form action="firstExample" method="post">
登录名
<input name="userId"/>
<button>查看姓名</button>
</form>
<!-- jsp可以在页面中写java代码 -->
<!-- jsp拥有自己的标签 -->
<%
String userName = "";
if (null != session.getAttribute("userName")) {
userName = session.getAttribute("userName").toString();
}
%>
<h4><%=userName%></h4>
</body>
</html>
-
去web.xml里配置接口
添加一个接口
web.xml
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://xmlns.jcp.org/xml/ns/javaee" xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd" id="WebApp_ID" version="3.1">
<display-name>HebutChat</display-name>
<welcome-file-list>
<welcome-file>index.html</welcome-file>
<welcome-file>index.htm</welcome-file>
<welcome-file>index.jsp</welcome-file>
<welcome-file>default.html</welcome-file>
<welcome-file>default.htm</welcome-file>
<welcome-file>default.jsp</welcome-file>
</welcome-file-list>
<servlet>
<servlet-name>firstExample</servlet-name>
<servlet-class>com.hebut.controller.IndexController</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>firstExample</servlet-name>
<url-pattern>/firstExample</url-pattern>
</servlet-mapping>
</web-app>
-
开始写控制器
image.png -
开始写连接数据库层
image.png -
运行项目，打开网页测试
image.png
后台管理系统
由此开始记录后台管理系统开发，不影响前台模块的开发，前台模块开发者可以参考
- 后台管理系统介绍
后台管理系统主要是为了管理河工小微的用户、发布的消息、评论、反馈信息等信息。
