实现验证码输入判断

如果输入正确，页面输出 输入的验证码正确！

如果输入错误，页面输出 输入的验证码错误！

代码如下

CodeServlrt：

import javax.imageio.ImageIO;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

/**
 * @author Sun
 * @version 2021.2
 * @date 2022/4/24 18:23
 */
public class CodeServlet extends HttpServlet {
    @Override
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws IOException {
        // 设置请求的编码
        request.setCharacterEncoding("UTF-8");
        // 设置响应的编码
        response.setContentType("text/html;charset=UTF-8");
        // 获取验证码
        String scode = CodeUtil.getCode();
        // 将验证码保存到session中，便于以后验证码
        request.getSession().setAttribute("scode", scode);
        // 发送图片
        ImageIO.write(CodeUtil.getCodeImg(scode), "JPEG", response.getOutputStream());
    }

    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws IOException {
        doPost(req, resp);
    }
}

CodeUtil:

/**
 * @author Sun
 * @version 2021.2
 * @date 2022/4/24 18:25
 */

import java.awt.*;
import java.awt.image.BufferedImage;
import java.util.Random;

/**
 * 验证码
 *
 * @author lck100
 */
public class CodeUtil {
    // 验证码长度
    private static int CODE_LENGTH = 5;
    // 单个验证码的宽度
    private static int SINGLECODE_WIDTH = 15;
    // 单个验证码的高度
    private static int SINGLECODE_HEIGHT = 30;
    // 单个验证码之间的间隔
    private static int SINGLECODE_GAP = 5;
    // 验证码图片的宽度
    private static int IMG_WIDTH = CODE_LENGTH * (SINGLECODE_WIDTH + SINGLECODE_GAP);
    // 验证码图片的长度
    private static int IMG_HEIGHT = SINGLECODE_HEIGHT;

    /**
     * 获取验证码
     *
     * @return 返回验证码值字符串
     */
    public static String getCode() {
        String code = "";
        for (int i = 0; i < CODE_LENGTH; i++) {
            code += (new Random()).nextInt(10);
        }
        return code;
    }

    /**
     * 画一张验证码图片
     *
     * @return 返回一张验证码图片
     */
    public static BufferedImage getCodeImg(String code) {
        BufferedImage img = new BufferedImage(IMG_WIDTH, IMG_HEIGHT, BufferedImage.TYPE_INT_BGR);
        // 得到图片上的一个画笔
        Graphics g = img.getGraphics();
        // 设置画笔的颜色，用来做背景色
        g.setColor(Color.YELLOW);
        // 用画笔填充一个矩形，矩形的左上角坐标，宽和高
        g.fillRect(0, 0, IMG_WIDTH, IMG_HEIGHT);
        // 将画笔颜色设置为黑色，用来写字
        g.setColor(Color.BLACK);
        // 设置字体：微软雅黑、不带格式的、字号
        g.setFont(new Font("微软雅黑", Font.PLAIN, SINGLECODE_HEIGHT + 5));
        // 输出数字
        char c;
        for (int i = 0; i < code.toCharArray().length; i++) {
            // 取到对应位置的字符
            c = code.charAt(i);
            // 画出一个字符串：要画的内容，开始的位置，高度
            g.drawString(c + "", i * (SINGLECODE_WIDTH + SINGLECODE_GAP) + SINGLECODE_GAP / 2, IMG_HEIGHT);
        }
        // 实例化一个随机数对象
        Random random = new Random();
        // 干扰因素
        for (int i = 0; i < 20; i++) {
            int x = random.nextInt(IMG_WIDTH);
            int y = random.nextInt(IMG_HEIGHT);
            int x2 = random.nextInt(IMG_WIDTH);
            int y2 = random.nextInt(IMG_HEIGHT);
            // 画干扰线
            g.drawLine(x, y, x + x2, y + y2);
        }
        return img;
    }
}

code.jsp:

<%--
  Created by IntelliJ IDEA.
  User: 86130
  Date: 2022/4/24
  Time: 18:26
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>验证码</title>
    <script type="text/javascript">
        window.onload= function fresh() {
            var time = new Date();
            document.getElementById("code").src = "codeServlet?time=" + time;
        }
    </script>
</head>
<body>
<center>
<form action="codejy.jsp" method="post">
    <img src="code" id="code"><a href="#" onclick="fresh()">看不清</a>
    <input type="text" name="ucode"><br>
    <input type="submit" value="提交">
</form>
</center>

</body>
</html>

codejy.jsp:

<%--
  Created by IntelliJ IDEA.
  User: 86130
  Date: 2022/4/24
  Time: 18:27
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
  <title>验证结果</title>
</head>
<body>
<%
  // 获取后台的验证码
  String scode = (String) session.getAttribute("scode");
  // 获取前台输入的验证码
  String ucode = request.getParameter("ucode");
  // 对二者进行比较对比
  if (scode.equals(ucode)) { %>
<h2>输入的验证码正确！</h2>
<% } else { %>
<h2>输入的验证码错误！</h2>
<% }

%>
</body>
</html>

部署web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
         version="4.0">
    <!--欢迎页面-->
    <welcome-file-list>
        <welcome-file>code.jsp</welcome-file>
    </welcome-file-list>
    <!--验证码Servlet-->
    <servlet>
        <servlet-name>CodeServlet</servlet-name>
        <servlet-class>CodeServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>CodeServlet</servlet-name>
        <url-pattern>/codeServlet</url-pattern>
    </servlet-mapping>
</web-app>

Servlet方式实现验证码--Javaweb（升级版/完整版）

实现验证码输入判断

代码如下

CodeServlrt：

CodeUtil:

code.jsp:

codejy.jsp:

部署web.xml

结果如图：

猜你喜欢