验证码实现步骤

一. 添加工具类  VerifyCode

VerifyCode.java  用于生成验证码

import java.awt.BasicStroke;
import java.awt.Color;
import java.awt.Font;
import java.awt.Graphics2D;
import java.awt.image.BufferedImage;
import java.io.IOException;
import java.io.OutputStream;
import java.util.Random;

import javax.imageio.ImageIO;

public class VerifyCode {
    private int w = 70;
    private int h = 35;
     private Random r = new Random();
     // {"宋体", "华文楷体", "黑体", "华文新魏", "华文隶书", "微软雅黑", "楷体_GB2312"}
    private String[] fontNames  = {"宋体", "华文楷体", "黑体", "微软雅黑", "楷体_GB2312"};
    private String codes  = "23456789abcdefghjkmnopqrstuvwxyzABCDEFGHJKMNPQRSTUVWXYZ";
    private Color bgColor  = new Color(255, 255, 255);
    private String text ;
    
    private Color randomColor () {
        int red = r.nextInt(150);
        int green = r.nextInt(150);
        int blue = r.nextInt(150);
        return new Color(red, green, blue);
    }
    
    private Font randomFont () {
        int index = r.nextInt(fontNames.length);
        String fontName = fontNames[index];
        int style = r.nextInt(4);
        int size = r.nextInt(5) + 24; 
        return new Font(fontName, style, size);
    }
    
    private void drawLine (BufferedImage image) {
        int num  = 3;
        Graphics2D g2 = (Graphics2D)image.getGraphics();
        for(int i = 0; i < num; i++) {
            int x1 = r.nextInt(w);
            int y1 = r.nextInt(h);
            int x2 = r.nextInt(w);
            int y2 = r.nextInt(h); 
            g2.setStroke(new BasicStroke(1.5F)); 
            g2.setColor(Color.BLUE); 
            g2.drawLine(x1, y1, x2, y2);
        }
    }
    
    private char randomChar () {
        int index = r.nextInt(codes.length());
        return codes.charAt(index);
    }
    
    private BufferedImage createImage () {
        BufferedImage image = new BufferedImage(w, h, BufferedImage.TYPE_INT_RGB); 
        Graphics2D g2 = (Graphics2D)image.getGraphics(); 
        g2.setColor(this.bgColor);
        g2.fillRect(0, 0, w, h);
         return image;
    }
    
    public BufferedImage getImage () {
        BufferedImage image = createImage(); 
        Graphics2D g2 = (Graphics2D)image.getGraphics();
        StringBuilder sb = new StringBuilder();
        // 向图片中画4个字符
        for(int i = 0; i < 4; i++)  {
            String s = randomChar() + ""; 
            sb.append(s); 
            float x = i * 1.0F * w / 4; 
            g2.setFont(randomFont()); 
            g2.setColor(randomColor()); 
            g2.drawString(s, x, h-5); 
        }
        this.text = sb.toString(); 
        drawLine(image); 
        return image;        
    }
    
    public String getText () {
        return text;
    }
    
    public static void output (BufferedImage image, OutputStream out) 
                throws IOException {
        ImageIO.write(image, "JPEG", out);
    }
}

 

二.controller层 (本项目是在SSM框架下)

    

  @RequestMapping(value = "/VerifyCodeServlet.do", method = RequestMethod.GET)
    public void VerifyCodeServlet(HttpServletRequest request, HttpServletResponse response) {
        System.out.println("enterV");
        VerifyCode vc = new VerifyCode();
        BufferedImage image = vc.getImage();//获取一次性验证码图片
        // 该方法必须在getImage()方法之后来调用
//        System.out.println(vc.getText());//获取图片上的文本
        try {
            VerifyCode.output(image, response.getOutputStream());//把图片写到指定流中
            // 把文本保存到session中，为验证码验证做准备
            request.getSession().setAttribute("vCode", vc.getText());
        } catch (IOException e) {
            e.printStackTrace();
        }
    }

 

三. 前端jsp页面

 <tr>
            <td class="login_info">验证码：</td>
            <td class="width70"><input id="vcode" name="" type="text" class="width70"/></td>
            <td><img id="verifyCode" src="<c:url value="/login/VerifyCodeServlet.do"/> "/></td>
            <td><span class="required" id="vcodeError">验证码错误</span></td>
 </tr>

每次进入该jsp页面  就会向后台请求获取验证码

 /*
         * 换一张验证码
         * */
        $("#verifyCode").click(function () {
            /**
             * 1 获取img元素
             * 2 重新设置他的src
             * 3 使用毫秒来添加参数 实现点击获得的验证码不同
             */

            $("#verifyCode").attr("src", "<%=request.getContextPath()%>/login/VerifyCodeServlet.do?a=" + new Date().getTime());
            document.getElementById("verifyCode").click();
        });

点击验证码图片 实现验证码看不清换一张功能

四

controller层校验验证码是否正确

 String vcode = (String) request.getSession().getAttribute("vCode");//获取session中存储的生成验证码
 boolean c = verifyCode.equalsIgnoreCase(vcode);//用户验证码校验