功能和开发技术介绍
本文介绍了使用SpringBoot作为后端框架,Vue作为前端框架,MyBatis-Plus进行持久层开 。详细描述了系统测试的目的、功能测试案例,包括登录验证和用户管理,以及数据库设计。
前端:vue3
开发工具:IDEA 或者eclipse都支持
编程语言: java
框架:springboot都支持
jdk版本:jdk1.8以上均可
数据库: mysql 版本不限
数据库工具:Navicat/SQLyog都可以
前后端分离Vue3+SpringBoot
源码获取地址下载
具体实现截图
开发核心技术介绍:
Vue.js的核心是虚拟DOM技术。虚拟DOM是一个内存中的数据结构,它可以帮助Vue.js实现高效的DOM操作,它采用了响应式数据绑定、虚拟DOM、组件化等现代化技术,为开发者提供了一种灵活、高效、易于维护的开发模式,当数据发生变化时,UI也会自动更新,这样就使得开发者可以更加专注于数据处理,而不是手动更新UI,这就是Vue体现出来的简洁,灵活,高效。
Java具有面向对象编程的特点,通过可视化开发可以快速的创建一个应用程序,减少程序员的工作量,Java是一种简洁、现代、通用的语言,具有垃圾收集机制,通过内存释放技术完成各种定义类型的回收,具有较强的编程能力。Java编译后生成Dll文件,其他程序可以通过对应的接口实现操作[15]。
Java具有典型的继承、封装多态特征,可以使用类和接口,并进行输入输出数据流,支持多线程和反射、以及网络编程。Java语言的多态提供方法中的和复写,Java语言不仅仅可以支持后台框架的开发,也可以与web前端进行融合[16]。
Spring Boot的一个主要优点是它的自动配置功能。它可以根据你的项目中的依赖关系自动配置应用程序。这使得配置应用程序变得非常容易,因为你不需要手动配置每个依赖项。
Spring Boot内置了Tomcat、Jetty和Undertow等服务器,这意味着你可以直接使用它们而不需要额外的安装和配置。
Mybatis是基于Mysql的一个优秀的持久层框架,其几乎将所有连接Java语言需要配置的地方包括JDBC都封装起来,不在向JDBC那样繁琐,让开发人员专注于编写SQL语句,其内部页添加了许多自己的规则,以便让Spring框架与其无缝结合。
核心代码部分展示
/**
* 登录相关
*/
@RequestMapping("users")
@RestController
public class UsersController{
@Autowired
private UsersService userService;
@Autowired
private TokenService tokenService;
/**
* 登录
*/
@IgnoreAuth
@PostMapping(value = "/login")
public R login(String username, String password, String captcha, HttpServletRequest request) {
UsersEntity user = userService.selectOne(new EntityWrapper<UsersEntity>().eq("username", username));
if(user==null || !user.getPassword().equals(password)) {
return R.error("账号或密码不正确");
}
String token = tokenService.generateToken(user.getId(),username, "users", user.getRole());
return R.ok().put("token", token);
}
/**
* 注册
*/
@IgnoreAuth
@PostMapping(value = "/register")
public R register(@RequestBody UsersEntity user){
if(userService.selectOne(new EntityWrapper<UsersEntity>().eq("username", user.getUsername())) !=null) {
return R.error("用户已存在");
}
userService.insert(user);
return R.ok();
}
/**
* 退出
*/
@GetMapping(value = "logout")
public R logout(HttpServletRequest request) {
request.getSession().invalidate();
return R.ok("退出成功");
}
/**
* 密码重置
*/
@IgnoreAuth
@RequestMapping(value = "/resetPass")
public R resetPass(String username, HttpServletRequest request){
UsersEntity user = userService.selectOne(new EntityWrapper<UsersEntity>().eq("username", username));
if(user==null) {
return R.error("账号不存在");
}
user.setPassword("123456");
userService.update(user,null);
return R.ok("密码已重置为:123456");
}
/**
* 列表
*/
@RequestMapping("/page")
public R page(@RequestParam Map<String, Object> params,UsersEntity user){
EntityWrapper<UsersEntity> ew = new EntityWrapper<UsersEntity>();
PageUtils page = userService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.allLike(ew, user), params), params));
return R.ok().put("data", page);
}
/**
* 列表
*/
@RequestMapping("/list")
public R list( UsersEntity user){
EntityWrapper<UsersEntity> ew = new EntityWrapper<UsersEntity>();
ew.allEq(MPUtil.allEQMapPre( user, "user"));
return R.ok().put("data", userService.selectListView(ew));
}
/**
* 信息
*/
@RequestMapping("/info/{id}")
public R info(@PathVariable("id") String id){
UsersEntity user = userService.selectById(id);
return R.ok().put("data", user);
}
系统运行步骤
(1) 创建好数据库并导入,
(2) 创建后台Springboot三层架构(controller,service,mapper层)并启动测试
(3) 导入并编译前端代码vue:网站和后台管理
编译:npm install
试运行:npm run dev