博客系统后端设计(五) - 实现登录页面功能

约定前后端交互接口


这里约定请求是一个 POST 请求,路径是 /login,使用的是以下的格式:
usernam=zhangsan&password=123


响应是 HTTP/1.1 302,因为在成功登录之后,会直接跳转到列表页,
因此此时的 Locationblog.list.html

此时的响应要求是 302,因此要使用 form 表单才可以进行页面的跳转;
如果是 ajax 请求,响应是 302 就无法进行跳转了,因为本身不会触发。

修改前段代码


把页面里加上 form 表单,使点击登录的操作能够触发请求。



上述图片圈出的就是要修改的地方。


可以看到上面两个结果是对应起来的。



以上就对应了前端代码中 form 标签里的 actionmethod 属性。

修改后端代码


要先创建一个新的类,起名可以为 loginServlet



上面圈出的是和之前约好的是一样的。


1.读取参数中的用户名和密码

 String username = req.getParameter("username");
 String password = req.getParameter("password");
 if (username == null || "".equals(username) || password == null || "".equals(password)) {
    
    
     // 登录失败
     String html = "<h3>登录失败。缺少用户名或者缺少密码!!!</h3>";
     resp.getWriter().write(html);
     return;
 }


需要注意的是:

如果用户名或者密码包含中文,此时就有可能乱码!!! 此时要设置请求的编码,告诉 Servlet 按照什么格式来理解请求。

 // 设置请求的编码,告诉 Servlet 按照什么格式来理解请求
 req.setCharacterEncoding("utf8");



2.读数据库,看看用户名是否存在,并且密码是否匹配

UserDao userDao = new UserDao();
User user = userDao.selectByUsername(username);
if (user == null) {
    
    
    // 用户不存在
    String html = "<h3>登录失败,用户名或密码错误!!!</h3>";
    resp.getWriter().write(html);
    return;
}
if (!password.equals(user.getPassword())) {
    
    
    //  密码不匹配
    String html = "<h3>登录失败,用户名或密码错误!!!</h3>";
    resp.getWriter().write(html);
    return;
}



3.用户名密码验证成功,登陆成功,接下来开始创建会话,使用该会话保存用户信息

HttpSession session = req.getSession(true);
session.setAttribute("user", user);


这里 ture 的意思是,存在就查询,不存在就创建新的。

4.进行重定向,跳转到指定的博客列表页

resp.sendRedirect("blog.list.html");


这里的 sendRedirect 方法参数是 列表页的字符串。

登录测试


在数据库中插入几个数据

在 db.sql 文件中,实现以下代码,但是还是需要复制到数据库中去执行,
因为这里的 db.sql 仅仅是相当于是一个记事本的作用。

-- 构造登录页测试数据
insert into user values(1, 'zhangsan', 123);
insert into user values(1, 'lisi', 123456);






此时点击登录就可以登录到列表页了。

猜你喜欢

转载自blog.csdn.net/m0_63033419/article/details/130664633