JavaWeb学习笔记——小任务 实现用户登录（加入验证码模块）

  下面的内容将会使用到Session技术来实现简单的用户登录的功能。

1.首先封装用户信息类

package cn.zhang.UserLogin;

public class User {
	private String userName;
	private String passWord;
	public String getUserName() {
		return userName;
	}
	public void setUserName(String username) {
		this.userName = username;
	}
	public String getPassWord() {
		return passWord;
	}
	public void setPassWord(String password) {
		this.passWord = password;
	}
}

2.创建Servlet

2.1首先创建Index类，用于显示网站首页面

package cn.zhang.UserLogin;

import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.*;

/**
 * Servlet implementation class Index
 * This document is used as the index page of the UserLogin project.
 * Author: TYUT_Zhang
 * Date: 2020-8-22
 */
@WebServlet("/Index")
public class Index extends HttpServlet {
	private static final long serialVersionUID = 1L;

	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		//解决乱码问题
		response.setContentType("text/html;charset=utf-8");
		//创建或者获取保存用户信息的Session对象
		HttpSession session = request.getSession();
		User user = (User)session.getAttribute("user");
		if(user == null) {
			response.getWriter().print("You are not logged in, please <a href='/UserLogin/login.html'>login</a>");
		}else {
			response.getWriter().print("Login successfully, welcome, " + user.getUserName() + " !");
			response.getWriter().print("<a href='/UserLogin/LogoutServlet'>LOGOUT</a>");
			//创建cookie存放Session标识号
			Cookie cookie = new Cookie("JSESSIONID",  session.getId());
			cookie.setMaxAge(60*30);
			cookie.setPath("/UserLogin");
			response.addCookie(cookie);
		}
	}
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		doGet(request, response);
	}
}

  其中，如果用户没有登录，那么就会有提示登录的消息，否则提示已经登录。

2.2创建LoginServlet类，显示登录成功后的页面

package cn.zhang.UserLogin;

import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.*;
/**
 * Servlet implementation class LoginServlet
 * This document is used as the page after login successfully.
 * Author: TYUT_Zhang
 * Date: 2020-8-22
 */
@WebServlet("/LoginServlet")
public class LoginServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;

	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		response.setContentType("text/html;charset=utf-8");
		String username = request.getParameter("userName");
		String password = request.getParameter("passWord");
		PrintWriter pw = response.getWriter();
		//匹配正确用户名与密码
		if(("zhangzuopeng").equals(username) && ("123").equals(password)) {
			User user = new User();
			user.setUserName(username);
			user.setPassWord(password);
			request.getSession().setAttribute("user", user);
			response.sendRedirect("/UserLogin/Index");
		}else {
			pw.write("Your username or password is ERROR, login failed !");
		}
	}
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		doGet(request, response);
	}
}

  如果登陆成功了，那么就跳转到首页面，否则提示错误，登录失败。

2.3创建LogoutServlet类，完成注销功能

package cn.zhang.UserLogin;

import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

/**
 * Servlet implementation class LogoutServlet
 * This document is used as the page to handle exiting.
 * Author: TYUT_Zhang
 * Date: 2020-8-22
 */
@WebServlet("/LogoutServlet")
public class LogoutServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;

	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		//把Session对象中的User对象移除
		request.getSession().removeAttribute("user");
		response.sendRedirect("/UserLogin/Index");
	}
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		doGet(request, response);
	}
}

  使得单击LOGOUT按钮时退出登录。

3.创建登陆页面login.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>TYUT_zhang_UserLogin</title>
</head>
<body>
	<form name="reg" action="/UserLogin/LoginServlet" method="post">
		USERNAME: <input name="userName" type="text" /><br />
		PASSWORD: <input name="passWord" type="password" /><br />
				  <input type="submit" value="Submit" id="bt" />
	</form>
</body>
</html>

4.代码部分编写完毕，此时进行测试

  启动Tomcat，输入网址访问login.html，显示如下图

  输入用户名与密码，点击“Submit”登录，登录成功显示第一张图，登录失败显示第二张图。


  如果在登录成功后的页面中单机LOGOUT，那么就会注销登录，显示如下图。

  此时单击login，重新范围login.html页面。

  到这里，这项实现用户登录的简单小任务就做好了！

---

---

5.拓展部分：利用Session实现一次性验证码

  该部分将会加入新的类，同时也会修改已有的文件，来对上面描述的程序进行升级，加入我们常见的验证码部分。

5.1修改login.html

  仅展示body部分

<body>
	<form name="reg" action="/UserLogin/LoginServlet" method="post">
		USERNAME: <input name="userName" type="text" /><br />
		PASSWORD: <input name="passWord" type="password" /><br />
		CHECKCODE: <input type="text" name="check_code">
		     <img src="/UserLogin/CheckServlet"><br />
		 <input type="submit" value="Submit" id="bt" />
	</form>
</body>

5.2编写CheckServlet类，用于产生验证码图片

package cn.zhang.UserLogin;

import java.awt.*;
import java.awt.image.*;
import java.io.*;
import javax.imageio.ImageIO;
import javax.servlet.*;
import javax.servlet.http.*;
import javax.servlet.annotation.WebServlet;

/**
 * Servlet implementation class CheckServlet
 * This document is used to create the check code.
 * Author: TYUT_Zhang
 * Date: 2020-8-22
 */
@WebServlet("/CheckServlet")
public class CheckServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;
	private static int WIDTH = 60;	//验证码图片宽度
	private static int HEIGHT = 20;	//验证码图片高度
	
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		HttpSession session = request.getSession();
		response.setContentType("img/jpeg");
		ServletOutputStream sos = response.getOutputStream();
		//设置浏览器不要缓存此图片
		response.setHeader("Pragma", "No-cache");
		response.setHeader("Cache-Control", "no-cache");
		response.setDateHeader("Expires", 0);
		//创建内存图像并获得其图形上下文
		BufferedImage image = new BufferedImage(WIDTH, HEIGHT,  BufferedImage.TYPE_INT_RGB);
		Graphics g =image.getGraphics();
		//产生随机验证码
		char[] rands = generateCheckCode();
		//结束图像的绘制过程，完成图像
		drawBackground(g);
		drawRands(g, rands);
		//将图像输出到客户端
		ByteArrayOutputStream bos = new ByteArrayOutputStream();
		ImageIO.write(image, "JPEG", bos);
		byte[] buf = bos.toByteArray();
		response.setContentLength(buf.length);
		sos.write(buf);
		bos.close();
		sos.close();
		//将当前验证码存入Session中
		session.setAttribute("check_code", new String(rands));
	}
	//生成四字符的验证码
	private char[] generateCheckCode() {
		String chars = "0123456789abcdefghijklmnopqrstuvwxyz";
		char[] rands = new char[4];
		for(int i=0; i<4; i++) {
			int rand = (int)(Math.random() * 36);
			rands[i] = chars.charAt(rand);
		}
		return rands;
	}
	private void drawRands(Graphics g, char[] rands) {
		g.setColor(Color.black);
		g.setFont(new Font(null, Font.ITALIC|Font.BOLD, 18));//斜体或粗体，字号18
		//在不同的高度上输出验证码的每个字符
		g.drawString("" + rands[0], 1, 17);
		g.drawString("" + rands[1], 16, 15);
		g.drawString("" + rands[2], 31, 18);
		g.drawString("" + rands[3], 46, 16);
		System.out.println(rands);
	}
	private void drawBackground(Graphics g) {
		//画背景
		g.setColor(new Color(0xDCDCDC));
		g.fillRect(0, 0, WIDTH, HEIGHT);
		//随机产生120个干扰点
		for (int i=0; i<120; i++) {
			int x = (int)(Math.random() * WIDTH);
			int y = (int)(Math.random() * HEIGHT);
			int red = (int)(Math.random() * 255);
			int green = (int)(Math.random() * 255);
			int blue = (int)(Math.random() * 255);
			g.setColor(new Color(red, green, blue));
			g.drawOval(x, y, 1, 0);			
		}
	}
}

5.3对LoginServlet类修改，加入对验证码的判断

  下面的代码为修改之后的代码

package cn.zhang.UserLogin;

import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.*;
/**
 * Servlet implementation class LoginServlet
 * This document is used as the page after login successfully.
 * Author: TYUT_Zhang
 * Date: 2020-8-22
 */
@WebServlet("/LoginServlet")
public class LoginServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;

	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		response.setContentType("text/html;charset=utf-8");
		String username = request.getParameter("userName");
		String password = request.getParameter("passWord");
		String checkCode = request.getParameter("check_code");
		String savedCode = (String) request.getSession().getAttribute("check_code");
		PrintWriter pw = response.getWriter();
		//匹配正确用户名与密码
		if(("zhangzuopeng").equals(username) && ("123").equals(password) && checkCode.equals(savedCode)) {
			User user = new User();
			user.setUserName(username);
			user.setPassWord(password);
			request.getSession().setAttribute("user", user);
			response.sendRedirect("/UserLogin/Index");
		}else if(checkCode.equals(savedCode)){
			pw.write("Your username or password is ERROR, login failed !");
		}else {
			pw.write("Check code is ERROR !!!");
		}
	}
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		doGet(request, response);
	}

}

5.4最终效果

  此时启动Tomcat，输入地址，显示下图登录页面

  如果三项均正确，则正常进行，不再重复展示，如果验证码错误，那么会显示下面图片的内容

  至此，简单用户登录的基本部分与拓展部分写完。