计算机毕设系列文章目录
第一章 毕设题分析及设计
第二章 项目数据库设计
第三章 maven项目搭建
第四章 前端文件结构
第五章 后台登录功能实现
第六章 后台登出功能实现
第七章 项目功能实现
第八章 项目功能实现
第九章 项目功能实现
第十章 项目功能实现
前言
本系列以黑马项目:瑞吉外卖作为例子,详细描述 毕设项目设计与实现 的流程~
给初学者的小建议:
上至项目,下至代码,能从网上copy的尽量从网上copy,再在他们的基础上修改、拓展,不断深入底层,这样循环往复才会获得更多的正反馈,更有学习的成就感~
gitee源项目链接:黑马-瑞吉外卖
一、后台登录功能实现流程
1.后端公共通用文件
- 把源项目的这三个文件夹复制到demo里com.itheima.reggie目录下即可,common --公共通用的代码块/常用常量定义封装等等(就是公用的代码),config --各种项目配置类 , utils --多功能、基于工具的包(通用工具类)。基本你看见参考项目有这三你都得先复制过来用!(具体请看注释和后续的使用~)
config/WebMvcConfig.java
文件中addResourceHandlers()
方法的作用就是静态资源映射路径,就是让系统能访问我们上一篇文章中提到的前端页面、资源
2.后台登录功能-前端实现学习
- 前端样式代码可看源项目注释,在这里就不多赘述了,这部分主要写 前端是如何发送登录请求的 。
backend/page/login.html
→ctrl+F
搜索定位登录
(登录按钮会绑定方法发送登录请求,找它准没错)→ 可知绑定的方法handleLogin
(vue单击绑定事件用@click...
)
- 搜索定位
handleLogin
→ 得知调用loginApi
发送请求
ctrl+鼠标左键
点loginApi
→ 跳到login.js
- 修改application.yml → port:8080改为8081,防止跟源项目同时启动时端口冲突 → 启动服务
- 浏览器访问系统登录页面 → http://localhost:8081/backend/page/login/login.html
- 按F12 → 打开调试工具,切换到Network → 点击登录 → 下方界面出现前端发送的登录请求login
3.后台登录功能-后端实现学习
- 前端发送请求,后端自然是接收请求并处理业务逻辑了,首先把目录结构创建完整
controller
--控制层:接收前端发送过来的请求
dto
--接收前端发送请求携带的数据的封装类
entity
--与数据库表对应的实体类
filter
--过滤器:过滤不同角色、权限访问不同的页面、数据
mapper
--服务层:与数据库进行交互,增删改查
service
--业务层:功能对应的业务逻辑细节的各种处理
- 首先
entity
目录下创建Employee
类 → 其中implements Serializable
(实现Serializable接口,用于序列化)
package com.itheima.reggie.entity;
import com.baomidou.mybatisplus.annotation.FieldFill;
import com.baomidou.mybatisplus.annotation.TableField;
import lombok.Data;
import java.io.Serializable;
import java.time.LocalDateTime;
/**
* 员工实体类
*/
//lombok插件提供的注解,封装了get/set等方法
@Data
public class Employee implements Serializable {
/** 序列号*/
private static final long serialVersionUID = 1L;
/**唯一主键*/
private Long id;
/**用户名*/
private String username;
/**姓名*/
private String name;
/**密码*/
private String password;
/**电话*/
private String phone;
/**性别*/
private String sex;
/**身份证号码*/
private String idNumber;
/**状态*/
private Integer status;
/**创建时间
* @TableField设置自动填充字段
* */
@TableField(fill = FieldFill.INSERT)
private LocalDateTime createTime;
/**更新时间*/
@TableField(fill = FieldFill.INSERT_UPDATE)
private LocalDateTime updateTime;
/**添加用户时使用*/
@TableField(fill = FieldFill.INSERT)
private Long createUser;
/**更新用户时使用*/
@TableField(fill = FieldFill.INSERT_UPDATE)
private Long updateUser;
}
controller
目录下新建EmployeeController
(这个是重点!!!)
LambdaQueryWrapper详解链接
package com.itheima.reggie.controller;
import com.baomidou.mybatisplus.core.conditions.query.LambdaQueryWrapper;
import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
import com.itheima.reggie.common.CommonsConst;
import com.itheima.reggie.common.R;
import com.itheima.reggie.entity.Employee;
import com.itheima.reggie.service.EmployeeService;
import lombok.extern.slf4j.Slf4j;
import org.apache.commons.lang.StringUtils;
import org.springframework.util.DigestUtils;
import org.springframework.web.bind.annotation.*;
import javax.annotation.Resource;
import javax.servlet.http.HttpServletRequest;
/**
* 员工控制类
*/
//Java日志框架
@Slf4j
//标注为controller(json格式数据的)
@RestController
//映射前端发来的请求
@RequestMapping("/employee")
public class EmployeeController {
//实现依赖注入
@Resource
private EmployeeService employeeService = null;
/**
* 登录请求处理
* TODO 后续改进将业务处理的代码放入业务层,这里只做数据请求与返回
*
* @param request
* @param employee
* @return
*/
@PostMapping("/login")
public R<Employee> login(HttpServletRequest request,
@RequestBody Employee employee) {
// 将页面提交的密码进行MD5加密
String password = employee.getPassword();
password = DigestUtils.md5DigestAsHex(password.getBytes());
// 根据用户名查数据库(LambdaQueryWrapper是mybatis-plus的查询条件构造器),首先实例化得到queryWrapper
LambdaQueryWrapper<Employee> queryWrapper = new LambdaQueryWrapper<Employee>();
// 调用查询条件构造器中eq方法
//(遍历Employee :: 调用getUsername方法 , 调用传入的employee中的getUsername方法)比较逗号两边的username是否相等
queryWrapper.eq(Employee::getUsername, employee.getUsername());
// 返回查询到的结果,用emp封装
Employee emp = employeeService.getOne(queryWrapper);
// 查不到返回登录失败结果
if (emp == null) {
return R.error(CommonsConst.LOGIN_FAIL);
}
// 比对密码
if (!emp.getPassword().equals(password)) {
return R.error(CommonsConst.LOGIN_FAIL);
}
// 查看员工状态
if (emp.getStatus() == CommonsConst.EMPLOYEE_STATUS_NO) {
return R.error(CommonsConst.LOGIN_ACCOUNT_STOP);
}
// 登录成功将员工的ID放入session中
request.getSession().setAttribute("employee", emp.getId());
return R.success(emp);
}
}
service
目录下新建EmployeeService
(是接口!新建时选绿色的Interface!不是Class)
package com.itheima.reggie.service;
import com.baomidou.mybatisplus.extension.service.IService;
import com.itheima.reggie.entity.Employee;
public interface EmployeeService extends IService<Employee> {}
service/impl
目录下新建EmployeeServiceImpl
(@Service --把该类自动注册到Spring容器)
package com.itheima.reggie.service.impl;
import com.baomidou.mybatisplus.extension.service.impl.ServiceImpl;
import com.itheima.reggie.entity.Employee;
import com.itheima.reggie.mapper.EmployeeMapper;
import com.itheima.reggie.service.EmployeeService;
import org.springframework.stereotype.Service;
@Service
public class EmployeeServiceImpl extends ServiceImpl<EmployeeMapper, Employee> implements EmployeeService {}
mapper
目录下新建EmployeeMapper
(是接口!新建时选绿色的Interface!不是Class)(@Mapper --不用写Mapper映射文件.xml)
package com.itheima.reggie.mapper;
import com.baomidou.mybatisplus.core.mapper.BaseMapper;
import com.itheima.reggie.entity.Employee;
import org.apache.ibatis.annotations.Mapper;
@Mapper
public interface EmployeeMapper extends BaseMapper<Employee> {}
- 上面的写完其实就已经完成登录功能了,这里补充下 把源项目
filter
目录下的LoginCheckFilter
复制过来,他的作用是 判断发过来的请求是否需要登录才能通过 ,也算是公共文件了,具体请看源项目注释~ - 最后我们的项目结构如图:
- 启动服务 → 浏览器访问系统登录页面 http://localhost:8081/backend/page/login/login.html → 成功登录进后台管理端首页(因为其他功能还没写所以页面会有报错)
至此,完成整个后台登录功能实现流程学习~ 后续我会先更新gitee上源项目的注释,大家可以先按照这个流程来一点一点复刻出所有功能。
总结
大家务必动手操作一遍,反正毕设的时候也得做的,熟练点可以避很多坑~
第一章 毕设题分析及设计
第二章 项目数据库设计
第三章 maven项目搭建
第四章 前端文件结构
第五章 后台登录功能实现
第六章 后台登出功能实现
第七章 项目功能实现
第八章 项目功能实现
第九章 项目功能实现
第十章 项目功能实现