以前看见各大网站都有图形化的验证码(虽然现在已经很少大型网站都不使用了)的时候就超级非常的好奇这个验证码到底是怎么实现的,真的是超级的羡慕…今天学习了很多东西,然后自己也来试着写了一下,为此记录下来,说不定以后会用得到吧 ~
这里以最原生的servlet来演示:
package com.service;
import javax.imageio.ImageIO;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.awt.*;
import java.awt.image.BufferedImage;
import java.io.IOException;
import java.util.Random;
//servlet3.0及以上可以使用注解,
@WebServlet("/ValidateCodeServlet")
public class ValidateCodeServlet extends HttpServlet {
//这个地方其实数字1和字母l,还有数字0和字母0很多时候会混淆,可以去掉。
//字符数组用来生成验证码
private char[] codeSequence = {'A', '1', 'B', 'C', '2', 'D', '3', 'E', '4', 'F', '5', 'G', '6', 'H', '7', 'I', '8', 'J',
'K', '9', 'L', '1', 'M', '2', 'N', 'P', '3', 'Q', '4', 'R', 'S', 'T', 'U', 'V', 'W',
'X', 'Y', 'Z'};
@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
int width = 76;
int height = 45;
Random random = new Random();
//设置response头信息
//禁止缓存
response.setHeader("Pragma", "No-cache");
response.setHeader("Cache-Control", "no-cache");
response.setDateHeader("Expires", 0);
//生成缓冲区image类
BufferedImage image = new BufferedImage(width, height, 1);
//产生image类的Graphics用于绘制操作
Graphics g = image.getGraphics();
//Graphics类的样式 背景颜色
g.setColor(new Color(16, 48, 77));//颜色可以随便改
g.setFont(new Font("Times New Roman", 0, 25));
g.fillRect(0, 0, width, height);
//绘制干扰线
for (int i = 0; i < 20; i++) {
g.setColor(this.getColor(130, 200));
int x = random.nextInt(width);
int y = random.nextInt(height);
int x1 = random.nextInt(12);
int y1 = random.nextInt(12);
g.drawLine(x, y, x + x1, y + y1);
}
//绘制字符
String strCode = "";
for (int i = 0; i < 4; i++) {
String rand = String.valueOf(codeSequence[random.nextInt(codeSequence.length)]);
strCode = strCode + rand;
// g.setColor(new Color(20+random.nextInt(110),20+random.nextInt(110),20+random.nextInt(110)));
//设置字体颜色
g.setColor(new Color(255, 255, 255));
g.drawString(rand, 13 * i + 8, 30);//这里是所处图片的位置
}
//将字符保存到session中用于前端的验证
request.getSession().setAttribute("authCode", strCode.toLowerCase());
g.dispose();
ImageIO.write(image, "JPEG", response.getOutputStream());
response.getOutputStream().flush();
}
public Color getColor(int fc, int bc) {
Random random = new Random();
if (fc > 255)
fc = 255;
if (bc > 255)
bc = 255;
int r = fc + random.nextInt(bc - fc);
int g = fc + random.nextInt(bc - fc);
int b = fc + random.nextInt(bc - fc);
return new Color(r, g, b);
}
}
servlet3.0
以下代码需要在web.xml
中加入下面的映射
<servlet>
<servlet-name>ValidateCodeServlet</servlet-name>
<servlet-class>com.service.ValidateCodeServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>ValidateCodeServlet</servlet-name>
<url-pattern>/ValidateCodeServlet</url-pattern>
</servlet-mapping>
最后来写个网页来演示一下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>验证码测试</title>
</head>
<body>
<img src="/firstWeb/ValidateCodeServlet" />
</body>
</html>
刷新一下:
完美实现!!!