手把手教你实现验证码功能-蒲公英云

手把手教你实现验证码功能

迷南。 2022-11-22 02:49 344阅读 0赞

前言

不少网站为了防止用户利用机器人自动注册、登录、灌水，都采用了验证码技术。所谓验证码，就是将一串随机产生的数字或符号，生成一幅图片，图片里加上一些干扰象素（防止OCR），由用户肉眼识别其中的验证码信息，输入表单提交网站验证，验证成功后才能使用某项功能。

实现方式

1）手写验证码

/** * 第一种生成验证码的方式 */
@WebServlet("/CheckCodeServlet")
public class CheckCodeServlet extends HttpServlet { 
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { 
        //声明两个变量存验证码的宽高
        int width=120;
        int height=40;
        //创建内存图像对象
        BufferedImage bimg=new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);
        //获得图像的画笔
         Graphics gp=bimg.getGraphics();
         //设置画笔颜色
         gp.setColor(Color.blue);
         //填充图像的背景颜色
         gp.fillRect(0, 0, width, height);
         //设置画笔颜色
         gp.setColor(Color.YELLOW);
         //设置画笔的字体
         gp.setFont(new Font("宋体", Font.BOLD, 30));
         //声明一个数组存可能作为验证码的字符
         String[] s1= { "0","1","2","3","4","5","6","7","8","9","a","b","c","d","e"};
         //声明字符串存验证码
         StringBuffer sb=new StringBuffer();
         //循环生成四个验证码
         for (int i = 0; i <4; i++) { 
            int index=(int)(Math.random()*s1.length);
            //生成的验证码字母为
            String code1=s1[index];
            //将生成的验证码写入到图像上
            gp.drawString(code1, i*20+10, 30);
            //将每次生成的字母存到sb中
            sb.append(code1);
        }
         //存储生成的验证码，用于登录时做校验
         request.getSession().setAttribute("checkcode", sb);
         //在图像画干扰线
        //设置画笔颜色
         gp.setColor(Color.red);
         for (int i = 0; i < 10; i++) { 
            gp.drawLine((int)(Math.random()*width), (int)(Math.random()*height), (int)(Math.random()*width), (int)(Math.random()*height));
        }
         //将生成的验证写到客户端
         ImageIO.write(bimg, "jpg", response.getOutputStream());
    }

2）验证码工具类

——ValidateCode.jar

/** * 第二种生成验证码的方式 */
@WebServlet("/CheckCodeServlet")
public class CheckCodeServlet extends HttpServlet { 
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { 
        //声明变量存储验证码宽度，高度，验证码的字母个数，验证码的干扰线的条数
        int width=120;
        int height=40;
        int count=4;
        int lineCount=20;
        //创建验证码对象
        ValidateCode vc=new ValidateCode(width, height, count, lineCount);
        //获取验证码
        String code1=vc.getCode();
        //System.out.println("生成的验证码："+code1);
        //将生成的验证码存到Session会话
        request.getSession().setAttribute("checkcode", code1);
        //将生成的验证码返回给客户端
        vc.write(response.getOutputStream());
    }
}

页面主要代码

<script type="text/javascript"> function changeImg() { // 时间戳 // 为了使每次生成图片不一致，即不让浏览器读缓存，所以需要加上时间戳 document.getElementById("imgObj").src="CheckCodeServlet?r="+new Date(); } </script>
<form action="${pageContext.request.contextPath}/checkCode" method="post">
请输入验证码：<input type="text" name="code" style="width: 80px;" />
<img id="imgObj" alt="验证码" src="${pageContext.request.contextPath}/checkCodeServlet"><a href="#" onclick="changeImg()">换一张</a><br/>
<input type="submit" value="提交" />
</form>