图形验证码代码

1. CodeUtil.java

   package com.kenai.util;
   import javax.imageio.ImageIO;
   import java.awt.*;
   import java.awt.image.BufferedImage;
   import java.awt.image.RenderedImage;
   import java.io.FileOutputStream;
   import java.io.IOException;
   import java.io.OutputStream;
   import java.util.HashMap;
   import java.util.Map;
   import java.util.Random;
   
   public class CodeUtil {
         
         
       private static final int width = 90;      //定义图片的宽度
       private static final int height = 20;     //定义图片的高度
       private static final int codeCount = 4;   //定义图片上显示的验证码的个数
       private static final int xx = 15;         //验证码左侧x坐标起始位置
       private static final int fontHeight = 18; // 字体大小
       private static final int codeY = 16;      //验证码左侧y坐标起始位置
       private static final char[] codeSequence = {
         
         'A','B','C','D','E','F','G','H','I','J','K','L','M','N',
               'O','P','Q','R','S','T','U','V','W','X','Y','Z','0','1','2','3','4','5','6','7','8','9'};
   
       /**
        * 生成一个map集合
        * code为生成的验证码
        * codePic为生成的验证码BufferedImage对象
        * @return
        */
       public static Map<String, Object> generateCodeAndPic(){
         
         
   		//定义图像buffer
           BufferedImage buffImg = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);
           Graphics gd = buffImg.getGraphics();
   		//创造一个随机数生成器类
           Random random = new Random();
   		//将图像填充为白色
           gd.setColor(Color.WHITE);
           gd.fillRect(0, 0, width, height);
   		//创建字体，字体的大小应该根据图片的高度决定, Font.BOLD:字体为粗体
           Font font = new Font("Fixedsys", Font.BOLD, fontHeight);
   		//设置字体
           gd.setFont(font);
   		//画边框
           gd.setColor(Color.BLACK);
           gd.drawRect(0, 0, width - 1, height - 1);
   		//随机产生40条干扰线，使图像中的认证码不易被其他程序探测到
           gd.setColor(Color.BLACK);
           for(int i = 0; i < 30; i++ ){
         
         
               int x = random.nextInt(width);
               int y = random.nextInt(height);
               int xl = random.nextInt(12);
               int yl = random.nextInt(12);
   		//前两个参数为起点坐标，后两个参数为终点坐标
               gd.drawLine(x, y, x + xl, y + yl);
           }
   		//randomeCode用于保证随机产生的验证码，以便用户登陆后进行验证
           StringBuffer randomCode = new StringBuffer();
           int red = 0, green = 0, blue = 0;
   		//随机产生codeCount数字的验证码
           for(int i = 0; i < codeCount; i ++){
         
         
   		//得到随机产生的验证码数字
               String code = String.valueOf(codeSequence[random.nextInt(36)]);
   		//产生随机的颜色分量来构造颜色值，这样输出的每位数字的颜色值都将不同
               red = random.nextInt(255);
               green = random.nextInt(255);
               blue = random.nextInt(255);
   		//用随机产生的颜色将验证码绘制到图像中
               gd.setColor(new Color(red, green, blue));
               gd.drawString(code, (i + 1) * xx, codeY);
   		//将产生的四个随机数组合在一起
               randomCode.append(code);
           }
           Map<String ,Object> map = new HashMap<String, Object>();
   		//存放验证码
           map.put("code", randomCode);
   		//存放验证码BuffedImage对象
           map.put("codePic", buffImg);
           return map;
       }
   
       public static void main(String[] args) throws IOException {
         
         
   		//创建文件输出流对象
           OutputStream out = new FileOutputStream("/Users/zhaolijian/Desktop/miaoshaStable/" + System.currentTimeMillis() + ".jpg");
           Map<String, Object> map = CodeUtil.generateCodeAndPic();
           ImageIO.write((RenderedImage)map.get("codePic"), "jpeg", out);
           System.out.println("验证码的值为：" + map.get("code"));
       }
   }
   

2. 调用代码

   @GetMapping(value = "/generateverifycode")
   public void generateverifycode(HttpServletResponse response) throws BusinessException, IOException {
         
         
       Map<String, Object> map = CodeUtil.generateCodeAndPic();
       redisTemplate.opsForValue().set("verify_code_" + userModel.getId(), map.get("code"));
       redisTemplate.expire("verify_code_" + userModel.getId(), 5, TimeUnit.MINUTES);
       ImageIO.write((RenderedImage)map.get("codePic"), "jpeg", response.getOutputStream());
   }
   

3. 前端界面

   <body>
   	<div class="content">
           <div id = "verifyDiv" style="display: none" class="form-actions">
               <img src=""/>
               <input type="text" id="verifyContent" value="">
               <button class="btn blue" id="verifyButton" type="submit">
                   验证
               </button>
           </div>
       </div>
   </body>
    // jQuery(document).ready()这个方法在dom载入就绪时对其进行操纵并调用执行它所绑定的函数。
   jQuery(document).ready(function(){
       var token = window.localStorage["token"];
       // 点击下单显示验证码，输入验证码点击验证提交生成令牌和下单请求
       $("#createorder").on("click", function () {
           if(token == null){
               alert("没有登陆，不能下单");
               window.location.href="login.html";
               return false;
           }
           $("#verifyDiv img").attr("src", "http://" + g_host + "/order/generateverifycode?token=" + token);
           $("#verifyDiv").show();
       });
       // 点击下单显示验证码，输入验证码点击验证提交生成令牌和下单请求
       $("#verifyButton").on("click", function () {
           $.ajax({
               type:"POST",
               contentType: "application/x-www-form-urlencoded",
               url:"http://" + g_host + "/order/generatetoken?token=" + token,
               data:{
                   "itemId":g_itemVO.id,
                   "promoId":g_itemVO.promoId,
                   "verifyCode":$("#verifyContent").val()
               },
               xhrFields:{withCredentials:true},
               success:function (data) {
                   if(data.status == "success"){
                       var promoToken = data.data;
                       $.ajax({
                           type:"POST",
                           contentType: "application/x-www-form-urlencoded",
                           url:"http://" + g_host + "/order/createorder?token=" + token,
                           data:{
                               "itemId":g_itemVO.id,
                               "promoId":g_itemVO.promoId,
                               "amount":1,
                               "promoToken":promoToken
                           },
                           xhrFields:{withCredentials:true},
                           success:function (data) {
                               if(data.status == "success"){
                                   alert("下单成功");
                                   window.location.reload();
                               }else{
                                   alert("下单失败，原因为"+data.data.errMsg);
                                   if(data.data.errCode == 20003){
                                       window.location.href="login.html";
                                   }
                               }
                           },
                           error:function (data) {
                               alert("下单失败，原因为"+data.responseText);
                           }
                       });
                   }else{
                       alert("获取令牌失败，原因为"+data.data.errMsg);
                       if(data.data.errCode == 20003){
                           window.location.href="login.html";
                       }
                   }
               },
               error:function (data) {
                   alert("获取令牌失败，原因为"+data.responseText);
               }
           });
       })
       initView();
   });