下面为你讲解如何使用JSP和Servlet实现生成登录验证码。
前置知识
在进行本文的代码实现前,你需要先了解以下技术:
- Java 编程语言
- Servlet 技术
- JSP 技术
- HTTP 协议
准备工作
在开始代码实现前,请确保你的开发环境中已经正确配置了JSP和Servlet开发环境。这里以Eclipse + Tomcat服务器为例,其他开发环境的配置方法可以自行搜索。
实现步骤
以下是实现JSP和Servlet生成登录验证码的步骤:
第一步:创建Servlet
首先在Eclipse中创建一个Servlet,使用doGet()方法生成验证码,并在session中存储验证码用于后续验证。
@WebServlet("/ImageServlet")
public class ImageServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
protected void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
// 设置页面不缓存
response.setHeader("Pragma", "No-cache");
response.setHeader("Cache-Control", "no-cache");
response.setDateHeader("Expires", 0);
// 定义验证码的宽度和高度
int width = 60, height = 20;
BufferedImage image = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);
Graphics g = image.getGraphics();
// 生成随机数
char[] rands = generateCheckCode();
// 画出验证码
drawCheckCode(g, rands, width, height);
// 结束绘制验证码
g.dispose();
// 将验证码存入session中
HttpSession session = request.getSession();
session.setAttribute("checkCode", new String(rands));
// 输出验证码到客户端
ImageIO.write(image, "JPEG", response.getOutputStream());
}
// 生成随机验证码
private char[] generateCheckCode() {
String chars = "0123456789abcdefghijklmnopqrstuvwxyz";
char[] rands = new char[4];
for (int i = 0; i < rands.length; i++) {
int rand = (int) (Math.random() * chars.length());
rands[i] = chars.charAt(rand);
}
return rands;
}
// 绘制验证码
private void drawCheckCode(Graphics g, char[] rands, int width, int height) {
for (int i = 0; i < rands.length; i++) {
g.setColor(Color.BLACK);
g.drawString(rands[i] + "", (i * 15) + 3, 18);
}
}
}
第二步:创建 JSP 页面
接下来创建登录页面,当用户访问登录页面时,生成验证码并将其显示在页面上。
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Login Page</title>
</head>
<body>
<form action="login" method="post">
<label for="username">Username:</label>
<input type="text" name="username" id="username" required /><br />
<label for="password">Password:</label>
<input type="password" name="password" id="password" required /><br />
<label for="checkCode">Check Code:</label>
<input type="text" name="checkCode" id="checkCode" required />
<!-- 显示验证码 -->
<img src="./ImageServlet" onclick="this.src='./ImageServlet?' + Math.random();" />
<br />
<input type="submit" value="Login" />
</form>
</body>
</html>
在上面的代码中,我们使用了<img>
标签来显示验证码,并且使用onclick
事件触发刷新验证码。
第三步:实现登录验证
最后,在Servlet中对用户输入的验证码进行校验,并返回验证结果。
@WebServlet("/login")
public class LoginServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
// 获取用户输入的用户名、密码和验证码
String username = request.getParameter("username");
String password = request.getParameter("password");
String checkCode = request.getParameter("checkCode");
// 获取session中存储的验证码
HttpSession session = request.getSession();
String sessionCheckCode = (String) session.getAttribute("checkCode");
// 验证用户名、密码和验证码是否正确
if ("admin".equals(username) && "123456".equals(password) && checkCode.equals(sessionCheckCode)) {
response.sendRedirect("success.html"); // 登录成功,跳转到 success.html 页面
} else {
response.sendRedirect("failed.html"); // 登录失败,跳转到 failed.html 页面
}
}
}
示例说明1
在上面的JSP代码中,我们使用Math.random()
方法来实现点击验证码之后的刷新效果。
<img src="./ImageServlet" onclick="this.src='./ImageServlet?' + Math.random();" />
当用户点击验证码时,页面中的<img>
标签的src
属性将被更新,从而触发重新加载验证码图片。
示例说明2
在上面的Servlet代码中,我们使用response.sendRedirect()
方法来实现页面的跳转。
if ("admin".equals(username) && "123456".equals(password) && checkCode.equals(sessionCheckCode)) {
response.sendRedirect("success.html"); // 登录成功,跳转到 success.html 页面
} else {
response.sendRedirect("failed.html"); // 登录失败,跳转到 failed.html 页面
}
根据用户输入的用户名、密码和验证码验证结果,Servlet将跳转到不同的页面,即success.html
或failed.html
。
本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:JSP + Servlet实现生成登录验证码示例 - Python技术站