记录项目开发中学习及遇到的技术问题和解决方法。
一、后端
参考:SpringBoot+Vue项目实例开发及部署-CSDN博客
postman:api 接口测试工具:Postman、Apifox、Apipost_postman apifox-CSDN博客
1. Springboot框架
SpringBoot就是尽可能地简化应用开发的门槛,让应用开发、测试、部署变得更加简单。
框架主体结构:controller层---dao---entity---form---service
参考学习:SpringBoot2.02官方参考指南(译)_w3cschool
最强SpringBoot实战教程内容通俗易懂springboot微服务开发实战Spring Boot2全套完整版_哔哩哔哩_bilibili
2. Redis缓存与JWT
项目中使用redis缓存生成的token,当接收前端传来的请求时,比较请求头的token是否有效,无效则拦截。当在未登录的情况下访问map路径(如:http://localhost:8000/yysystem/api/outapply/getalloutapply),无token返回login页面。
(1)Redis
参考:Redis下载安装与配置(windows)-CSDN博客
(2)JWT
<1>定义:JWT(JSON Web Token)是一种用于在网络应用间传递信息的安全传输方式。它是一种紧凑且自包含的方式,通过使用数字签名来验证数据的完整性和真实性。
<2>工作流程:
1.用户使用有效的身份凭证(如用户名和密码)向服务器发送登录请求。
2.服务器验证用户身份信息,如果验证通过,生成一个JWT并将其返回给客户端。
3.客户端在后续的请求中将JWT添加到请求的头部、查询参数或Cookie中进行传递。
4.服务器接收到请求后,使用密钥验证JWT的签名和完整性,并从中提取出有效的用户信息和权限等数据进行处理。
5.如果JWT验证通过,服务器处理请求并返回响应给客户端。
参考:Spring boot框架 JWT实现用户账户密码登录验证_springboot 账号密码登录-CSDN博客
3. Mybatis-plus
项目使用mybatis-plus,相较于mybatis开发更为简洁,基础的SQL语句无需自己实现。
mapper接口继承BaseMapper
service接口继承IService
参考:Mybatis-Plus详解_mybatisplus-CSDN博客
4.定时器
项目中在同意客户A的退住申请后,为保证客户A有足够时间离院及办理其他手续,一致在每天0:30分清除退住申请已被同意但客户表还存在信息的客户,及清除床位等信息。
5.Flyway插件
数据库版本控制。
参考:flyway:数据库版本管理_flyway数据库版本控制-CSDN博客
二、前端
本地要提前配置好node.js环境。
Node.js 是一个开源、跨平台的 JavaScript 运行时环境。
1.Vue框架
Vue被设计为可以自底向上逐层应用。Vue的核心库只关注视图层,易于上手,便于与第三方库或既有项目整合。
vue框架Q:
1-问题:element-ui有问题,无法显示图标,图标都显示为正方形。
解决方法:node.js版本为最新,下载稳定版本。
2-问题:图片不显示
解决方法:src会将路径处理为字符串,不会当做路径处理,使用 :src,并require(图片路径)。
<img :src="require('./assets/'+imgUrl)" alt="">
前端实现动态路由(前端控制全部路由,后端返回用户角色)_前端动态路由-CSDN博客
2.拦截器
当未登录而访问登录界面以外的界面拦截,并跳转至登录界面,保证信息安全。
三、自动测试
1.自动测试框架
首先要下载与浏览器版本匹配的driver。本项目使用Chromedriver,浏览器为最新版本119
使用提供的自动测试框架,在page目录编写代码定位页面元素,test目录下调用方法并判断逻辑是否正确。
2.selenium
自动测试主要使用selenium自动化工具。
参考:selenium-java常用api_selenium jar-CSDN博客
四、部署到虚拟机
1.基本流程
1.创建虚拟机
2.配置环境,安装redis,jdk,Tomcat,Nginx,mysql
3.打包前后端,修改后端打包方式为war包,前端打包npm run build为dist。后端war包放至虚拟机tomcat/webapps目录下,前端放置位置与Nginx配置文件中location一致即可。
4.开启所有服务,在浏览器输入虚拟机网址即可访问项目。