vue+socke+redis[可选用] 前后端分离:学校疫情上报系统
一、项目技术栈介绍
1. 前端
- 前端采用vue框架。
- 为了美化也采用了elementUI组件
- 页面跳转使用vue路由
- 与后端通信采用axios通信
2.后端
- 服务器与数据库交互的中间件使用redis(不使用除了访问速度变慢无其他影响)
- redis采用集群模式但同时支持一个redis服务器
- 与前端通信采用socket封装的http请求进行通信
- 使用到了spring来进行对象管理
- 通过spring的线程池管理,支持并发
- 使用了spring定时器来对redis缓存经行主动的定时更新(1分钟)
二、项目演示及其功能介绍
登录
登录页面可选择登录方式有三种:学生,教师,管理员
当点击登陆后,后端服务器若没有正常启动,会弹框“服务器已下线”
登录页面勾选自动登录会保存当前登录密码,方便下次登录
注册
注册学生时,会多选一个班级。
注册教师不需要选择班级。
当后端服务器没有正常启动,会弹框“服务器已下线”
登录成功
登录成功后都有统一的页头,最右边显示当前的登录用户点击账号旁边的按钮,可以选择注销和其他弹框
管理员页面
登录成功后,默认显示疫情上报统计。
该页面显示全校上报统计,教师上报统计,各个班级上报统计。
点击进入学生疫情上报详情
点击查询按钮可以根据选择的查询条件查询当日学生的上报情况
点击进入教师疫情上报详情
点击查询按钮可以根据选择的查询条件查询当日教师的上报情况
点击进入教师班级分配管理可以查看教师管理的对应班级情况
点击删除可以取消教师分配的班级。当前教师没有分配班级时,只显示教师工号。点击新建可以给教师分配班级。点击保存提交成功。
教师页面
教师登录成功后,默认显示当前的管理的班级的当日上报统计情况
点击查看上报历史,可以查看教师本人的上报历史,点击删除可以进行删除。可以进行过去日期的补报,一天只能上报一次。
选择疫情上报,可以选择对应信息进行疫情上报,点击立即上报,经行提交。
点击完善个人信息,填写完成后提交即可。
点击班级疫情上报查询内的查询按钮,可以根据查询条件,选择查询。
学生页面
学生页面是教师页面的阉割版,这里只进行简单选项卡展示
控制台页面
当后端服务器成功启动,显示
当redis服务器没有启动,但是后端服务器任然正常启动显示,这是正常现象。当redis服务器启动失败后,服务器会直接访问数据库。
三、测试说明
如果要测试,请阅读以下内容
项目名称:学校疫情上报系统
测试环境要求:
系统:
1.windows10
2.mysql数据库(具体版本可以更具系统环境修改maven依赖)
前端:
1.安装nodejs
后端:
1.jdk1.8
2.redis
也可以不启用
安装目录已经打包在项目 \学生疫情申报系统后端\resdis\Redis-x64-3.2.100目录下)
项目启动前需要的准备工作:
前端:使用vue安装必要的插件后run npm dev
后端:
1.还原mysql数据库(sql文件命名为httprequest)
这里推荐使用navcat连接mysql数据库经行还原
2.修改jar包的数据库配置文件
使用360解压工具,右键点击HttpReceive-1.0-SNAPSHOT.jar文件
点击360压缩\使用360压缩打开,找到spring-dao.xml文件打开修改一下配置
以下就是正常的数据库源的配置,不再赘述
<bean id="mysqlDataSource"
class="org.springframework.jdbc.datasource.DriverManagerDataSource">
<property name="driverClassName">
<value>com.mysql.jdbc.Driver</value>
</property>
<property name="url">
<value>jdbc:mysql://localhost:3306/httprequest</value>
</property>
<property name="username">
<value>root</value>
</property>
<property name="password">
<value>这里替换为密码</value>
</property>
</bean>
3.启动redis服务器。
redis解压文件在 学生疫情申报系统后端\resdis\Redis-x64-3.2.100目录下,
双击启动redis-server.exe即可(默认端口6379)
4.启动后端服务器方式
(1)生产环境启动方式
双击 学生疫情申报系统后端目录下的startup.bat即可。
若没有启动reids服务器,会报错,但是可以正常运行,运行速度可能会很慢。
正常启动后端服务器后会显示,初次使用会有2s左右的延迟卡顿,属于正常现象
SLF4J: Failed to load class "org.slf4j.impl.StaticLoggerBinder".
SLF4J: Defaulting to no-operation (NOP) logger implementation
SLF4J: See http://www.slf4j.org/codes.html#StaticLoggerBinder for further details.
信息|2021-09-21 11:00:55=:shardedJedis初始化参数读取成功
信息|2021-09-21 11:00:55=:127.0.0.1 : 6379 redis服务器读取并且初始化
信息|2021-09-21 11:00:57=:8888端口服务启动成功
四、开发说明
项目名称:学校疫情上报系统
开发环境要求:
系统:
1.windows10
2.mysql数据库(具体版本可以更具系统环境修改maven依赖)
前端:
1.安装nodejs 最好是安装vue3.0版本及以上,可以使用vue可视化
后端:
1.jdk1.8
2.maven
3.IDEA
4.mysql数据库(具体版本可以更具系统环境修改maven依赖)
开发项目启动方式:
前端:使用vue安装必要的插件后run npm dev
后端:
1.还原mysql数据库(sql文件命名为httprequest)
这里推荐使用navcat连接mysql数据库经行还原
2.使用idea打开目录 学生疫情申报系统后端源码\HttpRequest
(推荐使用idea是为了方便加载maven依赖,使用其他编译器可能更麻烦)
3.修改resource目录下的spring-dao.xml的数据库配置文件
以下就是正常的数据库源的配置,不再赘述
<bean id="mysqlDataSource"
class="org.springframework.jdbc.datasource.DriverManagerDataSource">
<property name="driverClassName">
<value>com.mysql.jdbc.Driver</value>
</property>
<property name="url">
<value>jdbc:mysql://localhost:3306/httprequest</value>
</property>
<property name="username">
<value>root</value>
</property>
<property name="password">
<value>这里替换为密码</value>
</property>
</bean>
4.启动redis服务器。
redis解压文件在 学生疫情申报系统后端\resdis\Redis-x64-3.2.100目录下,
双击启动redis-server.exe即可(默认端口6379)
5.启动后端服务器方式
(1)生产环境启动方式
双击 学生疫情申报系统后端目录下的startup.bat即可。
若没有启动reids服务器,会报错,但是可以正常运行,运行速度可能会很慢。
正常启动后端服务器后会显示,初次使用会有2s左右的延迟卡顿,属于正常现象
SLF4J: Failed to load class "org.slf4j.impl.StaticLoggerBinder".
SLF4J: Defaulting to no-operation (NOP) logger implementation
SLF4J: See http://www.slf4j.org/codes.html#StaticLoggerBinder for further details.
信息|2021-09-21 11:00:55=:shardedJedis初始化参数读取成功
信息|2021-09-21 11:00:55=:127.0.0.1 : 6379 redis服务器读取并且初始化
信息|2021-09-21 11:00:57=:8888端口服务启动成功后端:
五、项目下载
完整项目目录
注意:
管理员账户:admin 密码:1
其他账户注册即可
项目下载地址
链接:https://pan.baidu.com/s/19cL7A8_XEA5TG_sIQDmYmQ
提取码:mabo
六、如何修改相关配置
后端目录
有关服务器的配置文件
config.properties
#服务器的基本配置文件
# http服务的启动端口
serverPort=8888
### redis服务器地址&多个
#jedisIp=127.0.0.1&127.0.0.1&127.0.0.1
## redis服务器端口
#jedisPort=6379&8090&8091
#是否启用redis服务器
useRedis=true
jedisIp=127.0.0.1
# redis服务器端口
jedisPort=6379
# redis最大连接数
jedisMaxTotal=200
七、总结
该项目的优点
- 整体采用前后端分离的设计,能以微服务的方式将前端和后端分别部署到不同的服务器上面。
能够有效的减轻后端服务器的负担。 - redis采用集群的部署底层设计,能有支持高并发。
- 若redis中间件没有正常启动的时候,后端服务器任然可以正常启动,只是服务器的响应速度下降。
- 后端项目在读取redis配置,服务器初始化等方面,抛弃了每次执行前检测的机制,而是在启动服务器前进行初始化,使服务器对高并发的支持性更好。能够大幅度提高服务器响应速度,提高用户体验。
- 几乎所有的服务器相关配置、读取数据库的sql语句都写在了配置文件中。
- 几乎所有的jdbc查询语句都采用preparestatement语句操作,防止sql注入
- 增加了日志记录,相关的日志文件都会记录在启动文件同级目录下的log文件夹内。
- 除了spring的相关类和jdk的相关类库,额外引入了alibaba的JSON类库,没有使用其他不常见的类库。
- 采用MD5加密算法对密码敏感信息进行了加密。
10.在底层中增加了系统中各个方法运行的时间计算,并且可以在控制台看到。对今后的系统优化可以提供很好的帮助。
该项目的缺点
-
因为该项目后端与前端通信使用的使socket通信,当前端传入非法字符,后端接受到的使非法字符。可能会导致读取数据错误。导致的后果就是当前请求的数据异常。
-
为了使用定时器,采用了spring的定时器来定时删除redis的缓存,造成了代码的臃肿。
可以使用redis原生的具有实现的缓存操作来代替这个过程,并且不会出现遗漏。 -
代码方面,项目初期缺少对项目的规划,造成了项目的部分方法位置混乱,但是不影响项目的正常运行。
-
前后端通信的时,采用的使明文通信,有一定的安全问题。