图片验证码实例

java图片验证码

1.图片验证码工具类

package com.funi.esf.utils;

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 ImageVerificationCode {

    private int weight = 100;           //验证码图片的长和宽
    private int height = 40;
    private String text;                //用来保存验证码的文本内容
    private Random r = new Random();    //获取随机数对象
    //private String[] fontNames = {"宋体", "华文楷体", "黑体", "微软雅黑", "楷体_GB2312"};   //字体数组
    //字体数组
    private String[] fontNames = {"Georgia"};
    //验证码数组
    private String codes = "23456789abcdefghjkmnopqrstuvwxyzABCDEFGHJKMNPQRSTUVWXYZ";

    /**
     * 获取随机的颜色
     *
     * @return
     */
    private Color randomColor() {
        //这里为什么是225，因为当r，g，b都为255时，即为白色，为了好辨认，需要颜色深一点。
        int r = this.r.nextInt(225);
        int g = this.r.nextInt(225);
        int b = this.r.nextInt(225);
        return new Color(r, g, b);            //返回一个随机颜色
    }

    /**
     * 获取随机字体
     *
     * @return
     */
    private Font randomFont() {
        int index = r.nextInt(fontNames.length);  //获取随机的字体
        String fontName = fontNames[index];
        int style = r.nextInt(4);         //随机获取字体的样式，0是无样式，1是加粗，2是斜体，3是加粗加斜体
        int size = r.nextInt(10) + 24;    //随机获取字体的大小
        return new Font(fontName, style, size);   //返回一个随机的字体
    }

    /**
     * 获取随机字符
     *
     * @return
     */
    private char randomChar() {
        int index = r.nextInt(codes.length());
        return codes.charAt(index);
    }

    /**
     * 画干扰线，验证码干扰线用来防止计算机解析图片
     *
     * @param image
     */
    private void drawLine(BufferedImage image) {
        int num = r.nextInt(10); //定义干扰线的数量
        Graphics2D g = (Graphics2D) image.getGraphics();
        for (int i = 0; i < num; i++) {
            int x1 = r.nextInt(weight);
            int y1 = r.nextInt(height);
            int x2 = r.nextInt(weight);
            int y2 = r.nextInt(height);
            g.setColor(randomColor());
            g.drawLine(x1, y1, x2, y2);
        }
    }

    /**
     * 创建图片的方法
     *
     * @return
     */
    private BufferedImage createImage() {
        //创建图片缓冲区
        BufferedImage image = new BufferedImage(weight, height, BufferedImage.TYPE_INT_RGB);
        //获取画笔
        Graphics2D g = (Graphics2D) image.getGraphics();
        //设置背景色随机
        g.setColor(new Color(255, 255, r.nextInt(245) + 10));
        g.fillRect(0, 0, weight, height);
        //返回一个图片
        return image;
    }

    /**
     * 获取验证码图片的方法
     *
     * @return
     */
    public BufferedImage getImage() {
        BufferedImage image = createImage();
        Graphics2D g = (Graphics2D) image.getGraphics(); //获取画笔
        StringBuilder sb = new StringBuilder();
        for (int i = 0; i < 4; i++)             //画四个字符即可
        {
            String s = randomChar() + "";      //随机生成字符，因为只有画字符串的方法，没有画字符的方法，所以需要将字符变成字符串再画
            sb.append(s);                      //添加到StringBuilder里面
            float x = i * 1.0F * weight / 4;   //定义字符的x坐标
            g.setFont(randomFont());           //设置字体，随机
            g.setColor(randomColor());         //设置颜色，随机
            g.drawString(s, x, height - 5);
        }
        this.text = sb.toString();
        drawLine(image);
        return image;
    }

    /**
     * 获取验证码文本的方法
     *
     * @return
     */
    public String getText() {
        return text;
    }

    public static void output(BufferedImage image, OutputStream out) throws IOException                  //将验证码图片写出的方法
    {
        ImageIO.write(image, "JPEG", out);
    }
}

2.控制层生成验证码+验证验证码方法

 /**
     * 图片验证码
     * @param request
     * @param response
     */
    @RequestMapping("getVerifiCode")
    @ResponseBody
    public void getVerifiCode(HttpServletRequest request, HttpServletResponse response,
            @RequestParam(required = true) String action){
        try {
                response.setDateHeader("Expries", -1);
                response.setHeader("Cache-Control", "no-cache");
                response.setHeader("Pragma", "no-cache");
                String sessionId = request.getSession().getId();
                String captchaCodeSendingCacheKey = CaptchaCodeUtil.getCaptchaCodeCacheKey(sessionId, action);
                memcachedClient.set(captchaCodeSendingCacheKey, 60 * 5,"");
                ImageVerificationCode ivc = new ImageVerificationCode();
                BufferedImage image = ivc.getImage();  //获取验证码
                memcachedClient.set(captchaCodeSendingCacheKey, 60 * 5, ivc.getText());
                ivc.output(image, response.getOutputStream());//将验证码图片响应给客户端
        } catch (TimeoutException e) {
            e.printStackTrace();
        } catch (InterruptedException e) {
            e.printStackTrace();
        } catch (MemcachedException e) {
            e.printStackTrace();
        } catch (IOException e) {
            e.printStackTrace();
        }
    }

 /**
     * 校验图片验证码
     * @param request
     * @param response
     */
 @RequestMapping("/vaildImgYZMCode")
    @ResponseBody
    public Map vaildImgYZMCode(HttpServletRequest request, HttpServletResponse response,
            @RequestParam(required = true) String imgYZMCode,
                               @RequestParam(required = true) String action){
        Map map = new HashMap();
        try {
            String sessionId = request.getSession().getId();
            String captchaCodeSendingCacheKey = CaptchaCodeUtil.getCaptchaCodeCacheKey(sessionId, action);
            String imgYZMCodeOld =  memcachedClient.get(captchaCodeSendingCacheKey);
            if(StringUtils.isEmpty(imgYZMCode)){
                map.put("status","error");
                map.put("message","图片验证码为空");
            }
            if(imgYZMCode.equalsIgnoreCase(imgYZMCodeOld)){
                map.put("status","success");
                map.put("message","图片验证码成功");
            }
        } catch (TimeoutException e) {
            e.printStackTrace();
        } catch (InterruptedException e) {
            e.printStackTrace();
        } catch (MemcachedException e) {
            e.printStackTrace();
        }
        return map;
    }
``

3.`生成memcached缓存key值

package com.funi.esf.utils;

/**
 * @author
 */
public class CaptchaCodeUtil {
    /**
     * 图形验证码 验证码存储key
     * @param mac mac地址
     * @param action
     * @return 存储key
     */
    public static String getCaptchaCodeCacheKey( String mac,String action) {
        return "CaptchaCodeImg:" + action + ":" + mac;
    }
}

4.前端页面

 <tr>
                                <th><img id="yzm_img" style="cursor:pointer;width: 100px;height: 36px;margin: 5px 0 0 5px;border-radius: 3px;"
                                                   src="<c:url value="/password/getVerifiCode?action=resetAgent"/>"/>
                                </th>
                                <td>
                                    <div class="position">
                                        <input type="text" id="img_yzm_code"  class="input-t :required :advice;img_yzm_title"/>
                                        <span class="tip_advice" id="img_yzm_title">请输入正确的图片验证码</span>
                                        <button type="button" class="request-btn button-tj" id="getCode">发送手机验证码</button>
                                    </div>
                                </td>
                            </tr>


    $("#yzm_img").on("click",function () {
	      var localUrl = location.href;
	      var rootPath = localUrl.substring(0, localUrl.indexOf("password"));
	      var imgUrl= rootPath+'/password/getVerifiCode?action='+"resetAgent"+"&_dc="+Math.random();
	      console.log(imgUrl);
	      $("#yzm_img").attr('src', imgUrl );
  		})
    $("#img_yzm_code").on("blur",function () {
            var imgYZMCode = $("#img_yzm_code").val();
            if(imgYZMCode == null || '' == imgYZMCode){
                return;
            }
            if(imgYZMCode.length != 4){
                $("#img_yzm_code").val("")
                return;
            }
            var localUrl = location.href;
            var rootPath = localUrl.substring(0, localUrl.indexOf("password"));
            var data = {"imgYZMCode":imgYZMCode,"action":"resetAgent"}
            $.ajax({
                type: "get",
                dataType: "json",
                url: rootPath+'/password/vaildImgYZMCode',
                data:data,
                success: function (data) {
                    if (data != null) {
                        if(data.status=="success"){

                        }else{
                            $("#img_yzm_code").val("")
                        }
                    }else{
                        $("#img_yzm_code").val("")
                    }
                }
            });
        });

5.效果图