验证码的生成和验证

populace

大多网站登录时需要输入一个验证码，这主要是基于安全性方面的考虑。在这里将详细的说明一下验证码的生成和验证。

首先是java文件（这段java主要写了验证码图片的生成及各种特效，比如旋转、干扰线、噪点等，并将其用流的方式传到前端页面）：

1. package com.servlet;
   
2. import java.awt.BasicStroke;
   
3. import java.awt.Color;
   
4. import java.awt.Font;
   
5. import java.awt.Graphics;
   
6. import java.awt.Graphics2D;
   
7. import java.awt.Stroke;
   
8. import java.awt.image.BufferedImage;
   
9. import java.io.IOException;
   
10. import java.util.Random;
    
11. import javax.imageio.ImageIO;
    
12. import javax.servlet.ServletException;
    
13. import javax.servlet.ServletOutputStream;
    
14. import javax.servlet.http.HttpServlet;
    
15. import javax.servlet.http.HttpServletRequest;
    
16. import javax.servlet.http.HttpServletResponse;
    
17. import javax.servlet.http.HttpSession;
    
18. 
    
19. public class ImageServlet extends HttpServlet {
    
20. public void doGet(HttpServletRequest request, HttpServletResponse response)
    
21.    throws ServletException, IOException {
    
22.             doPost(request, response);
    
23. }
    
24. public void doPost(HttpServletRequest request, HttpServletResponse response)
    
25.   throws ServletException, IOException {
    
26.   int width=100;//验证码图片宽度
    
27.   int height=40;//验证码图片高度
    
28.   BufferedImage image=new BufferedImage(width,height,BufferedImage.TYPE_3BYTE_BGR);
    
29.   Graphics g=image.getGraphics();
    
30.   Graphics2D g2d = (Graphics2D) g;
    
31.   Random random=new Random();
    
32.   g.setColor(Color.white);//背景颜色（或getRandColor(160,250)）
    
33.   g.fillRect(0, 0, width, height);//画背景
    
34.   //g.setColor(getRandColor(0,255));//边框颜色
    
35.   //      g.drawRect(0, 0, width-1, height-1);//画边框
    
36. 
    
37. // 随机产生20条干扰线，使图象中的认证码不易被其它程序探测到
    
38.   g.setColor(getRandColor(160,200));  
    
39.   //Stroke stroke=new BasicStroke(3.0f);//设置线宽为3.0
    
40.   for(int i=0;i<20;i++){
    
41.    int x=random.nextInt(width);
    
42.    int y=random.nextInt(height);
    
43.    int x1=random.nextInt(20);
    
44.    int y1=random.nextInt(20);
    
45.    g.drawLine(x,y,x+x1,y+y1);
    
46.    //g2d.setStroke(stroke);
    
47.   }
    
48. 
    
49. // 随机产生20点，使图象中的认证码不易被其它程序探测到  
    
50.   g.setColor(getRandColor(160,200));
    
51.   for(int i=0;i<20;i++){
    
52.    int x=random.nextInt(width);
    
53.    int y=random.nextInt(height);
    
54.    g.drawLine(x, y, x, y);
    
55.   }
    
56. 
    
57. //随机生成不同的字体、字体样式和字体大小
    
58.   String[] fontName = {"微软雅黑","黑体","Georgia","Verdana","Arial","Comic Sans MS","Lucida Console"};
    
59.   int [] fontEffect = {Font.PLAIN, Font.ITALIC, Font.BOLD};
    
60.   int [] fontSize = {28, 30, 32, 26};
    
61.   Font[] fonts = new Font[fontName.length*fontEffect.length*fontSize.length];
    
62.   int fontsIndex=0;
    
63.   for(String str: fontName){
    
64.       for(int effect: fontEffect){
    
65.           for(int size : fontSize){
    
66.               Font font = new Font(str, effect, size);
    
67.               fonts[fontsIndex]=font;
    
68.               fontsIndex = fontsIndex +1;
    
69.           }
    
70.       }
    
71.   }
    
72.   String s="abcdefghijknpqrstuvxyzABCDEFGHJKLNPQRSTUVXYZ23456789"; // 设置备选验证码
    
73.   String sRand="";
    
74.         // 用随机产生的颜色将验证码绘制到图像中。
    
75.   int length = 4;  // 设置默认生成4个验证码
    
76.   for(int i=0;i<length;i++){
    
77.   g.setColor(new Color(20+random.nextInt(110), 20+random.nextInt(110), 20+random.nextInt(110))); // 生成随机颜色(因为是做前景，所以偏深)
    
78.       g.setFont(fonts[random.nextInt(fonts.length)]);  //调用上方的随机字体
    
79.    String ch=String.valueOf(s.charAt(random.nextInt(s.length())));
    
80. 
    
81. //设置字体旋转
    
82.    int zhuan = random.nextInt(20);
    
83.    int fzhuan = -random.nextInt(20);
    
84.       g2d.rotate(Math.toRadians(zhuan),25*(i-1),20);     /// 坐标系顺时针转
    
85.       g2d.rotate(Math.toRadians(fzhuan),25*(i-1),20);    /// 坐标系逆时针转
    
86.   
    
87.       sRand+=ch;
    
88.      g.drawString(ch, 18 * i + 15, 30); //将认证码用 drawString 函数显示到图象里
    
89. 
    
90.    g2d.rotate(Math.toRadians(-1*zhuan),25*(i-1),20);
    
91.    g2d.rotate(Math.toRadians(-1*fzhuan),25*(i-1),20);
    
92.   }
    
93.   //将生成的字符串存储在session中
    
94.   HttpSession session=request.getSession();   
    
95.   
    
96. //在认证码的上端画一条不规则的线
    
97.   int visit[] = new int[6];  
    
98.   for (int i = 0; i < visit.length; i++) {  
    
99.       visit[i] = 1 + (int) (Math.random() * 10);  
    
100.   }
     
101.   int visitValue = 0;  
     
102. g.setColor(Color.BLACK);  
     
103. int drawHigh[] = new int[6];  
     
104. int drawwidth[] = new int[6];  
     
105. //折点坐标  
     
106. for (int i = 0; i < 6; i++) {  
     
107.      drawHigh[i] = 40 - (int) (Math.ceil(visit[i] * 3.8));  
     
108.      drawwidth[i] = 5 + i * 17;  
     
109. }  
     
110. //g2d.setXORMode(Color.WHITE);
     
111.   g2d.setStroke(new BasicStroke(3.0f));  //折线粗细
     
112.   g2d.setPaint(Color.gray);//折线的颜色
     
113.   g2d.drawPolyline(drawwidth, drawHigh, 6);  //画折线  
     
114. 
     
115.   session.setAttribute("checkCode", sRand);
     
116.   g.dispose();//图像生效
     
117.   //禁止图像缓存
     
118.   response.setHeader("Pragma", "No-cache");
     
119.   response.setHeader("Cache-Control", "no-cache");
     
120.   response.setDateHeader("Expires", 0);   
     
121.   response.setContentType("image/jpeg");
     
122.   //创建二进制的输出流
     
123.   ServletOutputStream sos=response.getOutputStream();
     
124.         // 将图像输出到Servlet输出流中。
     
125.         ImageIO.write(image, "jpeg", sos);
     
126.         sos.flush();
     
127.         sos.close();
     
128. }
     
129. public Color getRandColor(int lower,int upper){
     
130.       Random random = new Random();
     
131.       if(upper>255)
     
132.        upper=255;
     
133.       if(upper<1)
     
134.        upper=1;
     
135.       if(lower<1)
     
136.        lower=1;
     
137.       if(lower>255)
     
138.        lower=255;
     
139.       int r=lower+random.nextInt(upper-lower);
     
140.       int g=lower+random.nextInt(upper-lower);
     
141.       int b=lower+random.nextInt(upper-lower);
     
142.       return new Color(r,g,b);
     
143.     }
     
144. }

复制代码

然后是前端的jsp展示页面（这里主要是写了一个方法来调用后端，将生成的验证码图片展示出来）

1. <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
   
2. <%
   
3. String path = request.getContextPath();
   
4. String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
   
5. %>
   
6. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
   
7. <html>
   
8.   <head>
   
9.     <base href="<%=basePath%>">
   
10.     <title>验证码的生成和验证</title>  
    
11.     <meta http-equiv="pragma" content="no-cache">
    
12.     <meta http-equiv="cache-control" content="no-cache">
    
13.     <meta http-equiv="expires" content="0">   
    
14. 
    
15.     <script type="text/javascript"  src="http://code.jquery.com/jquery-1.9.1.js"></script>
    
16.     <script type="text/javascript" language="javascript">
    
17.           function changeImg(){
    
18.               $("#img").attr("src", "ImageServlet?time="+new Date());
    
19.         }
    
20.           $(function(){
    
21.                $("#button").click(function(){
    
22.                   changeImg();
    
23.                   var v_inputCode = document.getElementById("validate").value.toLowerCase();
    
24.                   if(v_inputCode == ""){
    
25.                       alert("请输入验证码");
    
26.                   }else{
    
27.                       $.post("<%=basePath%>test.htm",{inputCode:v_inputCode},
    
28.                     function(data){
    
29.                         data = $.parseJSON(data);
    
30.                         if(data.test== 1){
    
31.                             alert("请输入正确的验证码");
    
32.                         }else{
    
33.                             alert("验证码输入正确");
    
34.                             location.href='../jsp/index.html';//跳转页面
    
35.                         }
    
36.                       });
    
37.                   }
    
38.             });
    
39.           });
    
40.     </script>
    
41. </head>
    
42.   
    
43. <body>
    
44.     <form  action="#">
    
45.         <table>
    
46.             <caption>验证码测试</caption>
    
47.             <tr>
    
48.                 <td>验证码</td>
    
49.                 <td colspan="2">
    
50.                     <input type="text" id="validate" />
    
51.                     <a href='javascript:changeImg();' title="看不清请点我" >
    
52.                         <img id="img" align="middle" src="ImageServlet" />
    
53.                     </a>
    
54.                 </td>
    
55.             </tr>
    
56.             <tr>
    
57.                 <td colspan="2"><input id="button" type="button" value="查&nbsp;&nbsp;询" /></td>
    
58.             </tr>
    
59.          </table>
    
60.     </form>
    
61. </body>  
    
62. </html>

复制代码

最后是验证（这里主要是将前端传入的用户输入的验证码与session中的验证码作对比，再返回给前端）：

1. import java.text.SimpleDateFormat;
   
2. import java.util.ArrayList;
   
3. import java.util.Date;
   
4. import java.util.HashMap;
   
5. import java.util.List;
   
6. import java.util.Map;
   
7. 
   
8. import javax.annotation.Resource;
   
9. import javax.mail.Session;
   
10. import javax.servlet.http.HttpServletRequest;
    
11. import javax.servlet.http.HttpServletResponse;
    
12. 
    
13. import net.sf.json.util.NewBeanInstanceStrategy;
    
14. 
    
15. import org.omg.CORBA.PUBLIC_MEMBER;
    
16. import org.springframework.stereotype.Controller;
    
17. import org.springframework.web.bind.annotation.RequestMapping;
    
18. import org.springframework.web.bind.annotation.RequestMethod;
    
19. import org.springframework.web.bind.annotation.ResponseBody;
    
20. 
    
21. import com.util.StringUtil;
    
22. 
    
23. @Controller
    
24. public class TestController {
    
25.     @Resource(name = "stringutil")
    
26.     private StringUtil stringUtil;
    
27.    
    
28.     @RequestMapping(value = "test.htm",method = RequestMethod.POST)
    
29.     public @ResponseBody Map<String, Object> querycard(HttpServletRequest request,
    
30.             HttpServletResponse response){
    
31.         Map<String, Object> result = new HashMap<String, Object>();
    
32.         String string = request.getSession().getAttribute("checkCode").toString();
    
33.         Map<String, Object> requestMap = stringUtil.getParamsForJqgrid(request);
    
34.         Map<String, Object> map = (Map<String, Object>) requestMap.get("paraMap");
    
35.         if((string.toLowerCase()).equals(map.get("inputCode").toString().toLowerCase())){//不区分大小写（将两个值都转换成小写再进行比较）
    
36.             result.put("test",0);//true
    
37.         }else {
    
38.             result.put("test",1);//false
    
39.         }
    
40.         return result;
    
41.     }
    
42. }

复制代码

llli

现在市场上出现很多提供验证码验证的第三方sdk，不需要自己写这么麻烦了，我本身之前有集成过一个SMSSDK这个，可以获取验证验证的，觉得还不错，有兴趣可以去了解下！