JSP&Servlet(13)——使用Servlet实现验证码功能

效果展示

项目结构

源码

java

CodeServlet.java

将后端生成的验证码传到前台。

package servlet;

import utils.CodeUtil;

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

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.java

生成验证码和验证码图片的工具类。

package utils;

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;
    }
}

web

code.jsp

验证码的输入表单,在这个JSP中将使用CodeServlet刷新验证码,将结果传到verify.jsp中进行验证。

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>验证码</title>
</head>
<body>
<form action="verify.jsp" method="post">
    <img src="code" id="code"><a href="#" onclick="fresh()">看不清</a>
    <input type="text" name="ucode"><br>
    <input type="submit" value="提交">
</form>
<script type="text/javascript">
    function fresh() {
        var time = new Date();
        document.getElementById("code").src = "codeServlet?time=" + time;
    }
</script>
</body>
</html>

verify.jsp

对输入的验证码与后端生成的验证码进行比较验证。

<%@ 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

对Servlet进行注册

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

 

如果对完整源码感兴趣。

可搜索微信公众号【Java实例程序】或者扫描下方二维码关注公众号获取更多。

注意:在公众号后台回复【CSDN201910081340】可获取本节源码。

 

  • 0
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值