第二篇:吉瑞外卖项目__后台登录功能开发_后台退出功能开发

简介: 第二篇:吉瑞外卖项目__后台登录功能开发_后台退出功能开发

后台登录功能开发


需求分析

页面原型展示

1.png


登录页面展示


(页面位置:项目/resources/backend/page/login/login.html)


2.png


查看登录请求信息


通过浏览器调试工具(F12),可以发现,点击登录按钮时,页面会发送请求(请求地址为http://localhost:8080/employee/login)并提交参数(username和password)


此时报404,是因为我们的后台系统还没有响应此请求的处理器,所以我们需要创建相关类来处理登录请求


3.png


分析前端页面代码


只有当res中的code数据 == 1时候,才可以继续往下执行的。将对象转换成JSON格式。


4.png


代码开发


创建Employee实体类


@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;
    private LocalDateTime createTime;
    private LocalDateTime updateTime;
    @TableField(fill = FieldFill.INSERT)
    private Long createUser;
    @TableField(fill = FieldFill.INSERT_UPDATE)
    private Long updateUser;
}


创建Mapper层


这里只需要写接口就行,因为使用的是动态代理创建实体类的。接口参数里面要写对应的实体类


@Mapper中包含了将对象加入到Spring容器中


@Mapper
public interface EmployeeMapper extends BaseMapper<Employee> {
}


创建Service层


public interface EmployeeService extends IService<Employee> {
}


先继承一个父类,第一个参数指的是dao层的接口,第二个参数指的是实体类,然后实现接口


@Service
public class EmployeeServiceImpl extends ServiceImpl<EmployeeMapper, Employee> implements EmployeeService {
}


Controller层


@RestController 是@controller和@ResponseBody 的结合


将当前修饰的类注入SpringBoot IOC容器,使得从该类所在的项目跑起来的过程中,这个类就被实例化。


该类中所有的API接口返回的数据,甭管你对应的方法返回Map或是其他Object,它会以Json字符串的形式返回给客户端


@Slf4j
@RestController
@RequestMapping("/employee")
public class EmployController {
    @Autowired
    private EmployeeService employeeService;
}


返回结果类R


此类是一个通用结果类,服务端响应的所有结果最终都会包装成此种类型返回给前端页面。


如果成功的话,传递的是Employee的对象,如果失败的话,传递的是一句错误语句。


@Data
public class R<T> {
    private Integer code; //编码:1成功,0和其它数字为失败
    private String msg; //错误信息
    private T data; //数据
    private Map map = new HashMap(); //动态数据
    public static <T> R<T> success(T object) {
        R<T> r = new R<T>();
        r.data = object;
        r.code = 1;
        return r;
    }
    public static <T> R<T> error(String msg) {
        R r = new R();
        r.msg = msg;
        r.code = 0;
        return r;
    }
    public R<T> add(String key, Object value) {
        this.map.put(key, value);
        return this;
    }
}


在Controller中创建登录方法


99cad1055b7d49098cc5ecf1c27edafe.png


处理逻辑如下:


  • 将页面提交的密码password进行md5加密处理


//        1. 将页面提交的密码进行md5加密处理
        String password = employee.getPassword();
        password = DigestUtils.md5DigestAsHex(password.getBytes());


  • 根据页面提交的用户名username查询数据库


//        2. 根据username查询数据库
        LambdaQueryWrapper<Employee> queryWrapper = new LambdaQueryWrapper<>();
        queryWrapper.eq(Employee::getUsername,employee.getUsername());  // 为sql语句添加条件,第一个参数指的是数据库对象中的列名字,第二个参数指的是获取到的employee参数。
        Employee emp = employeeService.getOne(queryWrapper);  // 唯一性查询,


  • 如果没有查询到则返回登录失败结果


//        3. 如果没有查询到则返回登录失败结果
        if (emp == null) {
            return R.error("登录失败");
        }


密码比对,如果不一致则返回登录失败结果


//        4. 密码比对,如果密码不一致则返回
        if (!emp.getPassword().equals(password)) {
            return R.error("登录失败");
        }


查看员工状态,如果为已禁用状态,则返回员工已禁用结果


//        5. 查看员工状态是否可以使用
        if (emp.getStatus() == 0) {
            return R.error("账号已禁用");
        }


  • 登录成功,将员工id存入Session并返回登录成功结果
//        6. 登录成功,将员工id存放到session,并返回正确的结果
        request.getSession().setAttribute("employee",emp.getId());
        return R.success(emp);
    }


---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------


后台退出功能开发


后台退出功能开发


需求分析


员工登录成功后,页面跳转到后台系统首页面(backend/index.html),此时会显示当前登录用户的姓名


如果员工需要退出系统,直接点击右侧的退出按钮即可退出系统,退出系统后页面应跳转回登录页面


代码开发



用户点击页面中退出按钮,发送请求,请求地址为/employee/logout,请求方式为POST。

我们只需要在Controller中创建对应的处理方法即可,具体的处理逻辑:

1、清理Session中的用户id

2、返回结果


// 员工退出
    @PostMapping("/logout")
    public R<String> logout(HttpServletRequest request ) {
//        清除session
        request.getSession().removeAttribute("employee");
        return R.success("退出成功");
    }
相关文章
|
7月前
|
小程序 API
点餐小程序实战教程09-订单功能开发
点餐小程序实战教程09-订单功能开发
|
6月前
|
小程序
微信小程序没有后台切换如何解决
微信小程序没有后台切换如何解决
|
7月前
|
存储 安全 JavaScript
消费全返商城系统开发详细指南/步骤需求/功能设计/源码程序
开发消费全返商城系统需要综合考虑多个方面,包括系统功能、技术架构、用户体验等。
|
7月前
|
小程序 JavaScript 前端开发
点餐小程序实战教程08-购物车功能开发
点餐小程序实战教程08-购物车功能开发
|
7月前
|
小程序 算法 数据可视化
点餐小程序实战教程07-点餐功能开发
点餐小程序实战教程07-点餐功能开发
|
缓存 小程序 JavaScript
云开发小程序倒计时防刷新功能及签到功能
云开发小程序倒计时防刷新功能及签到功能
64 0
|
小程序 前端开发
【易售小程序项目】修改“我的”界面前端实现;查看、重新编辑、下架自己发布的商品【后端基于若依管理系统开发】
【易售小程序项目】修改“我的”界面前端实现;查看、重新编辑、下架自己发布的商品【后端基于若依管理系统开发】
94 0
|
存储 小程序 前端开发
【易售小程序项目】私聊功能uniapp界面实现 (买家、卖家 沟通商品信息)【后端基于若依管理系统开发】
【易售小程序项目】私聊功能uniapp界面实现 (买家、卖家 沟通商品信息)【后端基于若依管理系统开发】
179 0
|
缓存 小程序 前端开发
【易售小程序项目】请求包创建+登录功能实现【基于若依管理系统开发】
【易售小程序项目】请求包创建+登录功能实现【基于若依管理系统开发】
141 0
|
数据安全/隐私保护 Python
python线上商城网站项目前台和后台源码
python线上商城网站项目前台和后台源码
151 0