验证码的简单实现-白红宇

验证码的简单实现

阅读量：358 次

发布时间：2019-03-04

本文共 1131 字，大约阅读时间需要 3 分钟。

图片验证码实现
图片验证码是一种常见的防止恶意表单注册的技术，通过生成随机图片并结合时间戳来避免浏览器缓存，从而实现验证效果。
以下是实现方法：
基本实现
1. 创建图片对象
BufferedImage image = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);
2. 美化图片
- 填充背景色
g.setColor(Color.PINK); g.fillRect(0, 0, width, height);
- 画边框
g.setColor(Color.BLUE); g.drawRect(0, 0, width - 1, height - 1);
- 生成随机字符并绘制验证码
Random ran = new Random(); for (int i = 1; i <= 4; i++) { char ch = str.charAt(ran.nextInt(str.length())); g.drawString(ch + "", width/5*i, height/2); }
- 添加干扰线
g.setColor(Color.GREEN); for (int i = 0; i < 10; i++) { int x1 = ran.nextInt(width); int x2 = ran.nextInt(width); int y1 = ran.nextInt(height); int y2 = ran.nextInt(height); g.drawLine(x1, y1, x2, y2); }
3. 输出图片
ImageIO.write(image, "jpg", response.getOutputStream());
HTML表单配合
为了实现图片的自动更换，可以通过以下方式绑定点击事件：
1. 给图片绑定点击事件
img.onclick = function() { var time = new Date().getTime(); img.src = "/checkCodeServlet?" + time; }
2. 给文字链接绑定点击事件
change.onclick = function() { var time = new Date().getTime(); img.src = "/checkCodeServlet?" + time; }
注意事项：
- 点击图片或文字会触发图片刷新，防止浏览器缓存导致的重复验证问题
- 使用时间戳确保每次请求都是唯一的临时链接
通过上述方法，可以实现图片验证码的自动更换功能，同时有效防止恶意表单注册。