java的验证码的是使用

很多时候我们都需要使用验证码。这里记录下我最近学会的一种验证的使用
首先在pom.xml文件中添加jar包

        <!--验证码的包，使用时需要到web.xml中去配置 -->
        <dependency>
            <groupId>com.github.penggle</groupId>
            <artifactId>kaptcha</artifactId>
            <version>2.3.2</version>
        </dependency>

添加完成之后我们需要去web.xml中对它进行配置

<servlet>
        <!-- 生成图片的Servlet -->
        <servlet-name>Kaptcha</servlet-name>
        <servlet-class>com.google.code.kaptcha.servlet.KaptchaServlet</servlet-class>

        <!-- 是否有边框 -->
        <init-param>
            <param-name>kaptcha.border</param-name>
            <param-value>no</param-value>
        </init-param>
        <!-- 字体颜色 -->
        <init-param>
            <param-name>kaptcha.textproducer.font.color</param-name>
            <param-value>red</param-value>
        </init-param>
        <!-- 图片宽度 -->
        <init-param>
            <param-name>kaptcha.image.width</param-name>
            <param-value>135</param-value>
        </init-param>
        <!-- 使用哪些字符生成验证码 -->
        <init-param>
            <param-name>kaptcha.textproducer.char.string</param-name>
            <param-value>ACDEFHKPRSTWX345679</param-value>
        </init-param>
        <!-- 图片高度 -->
        <init-param>
            <param-name>kaptcha.image.height</param-name>
            <param-value>50</param-value>
        </init-param>
        <!-- 字体大小 -->
        <init-param>
            <param-name>kaptcha.textproducer.font.size</param-name>
            <param-value>43</param-value>
        </init-param>
        <!-- 干扰线的颜色 -->
        <init-param>
            <param-name>kaptcha.noise.color</param-name>
            <param-value>black</param-value>
        </init-param>
        <!-- 字符个数 -->
        <init-param>
            <param-name>kaptcha.textproducer.char.length</param-name>
            <param-value>4</param-value>
        </init-param>
        <!-- 使用哪些字体 -->
        <init-param>
            <param-name>kaptcha.textproducer.font.names</param-name>
            <param-value>Arial</param-value>
        </init-param>
    </servlet>
        <!-- 映射的url -->
    <servlet-mapping>
        <servlet-name>Kaptcha</servlet-name>
        <url-pattern>/Kaptcha</url-pattern>
    </servlet-mapping>

配置完成之后我们就可以在前台页面直接使用啦

前台页面的用法

//直接在img的src添加../Kaptcha就可以了
<div class="item-content">
      <div class="item-inner">
          <div class="item-title label">验证码</div>
             <div class="item-input">
             <input type="text" id="kaptcha" placeholder="验证码">                
             </div>
       <div class="item-input">
              <img  id="kaprchaImg" alt="点击更换" title="点击更换"            
                     onclick="changeVerifyCode(this)" src="../Kaptcha" >
               </div>
           </div>
 </div>

js中更换验证码的方法

function changeVerifyCode(img){
    img.src = "../Kaptcha?" + Math.floor(Math.random() * 100);
}

然后将前台输入的验证码传到后台验证，其实也可以直接用前台代码实现验证码，然后直接在前台验证，这里就不说了，毕竟我前台代码技术太垃圾了。

 var verificationCode=$('#kaptcha').val();
               if(!verificationCode){
                   $.toast('请输入验证码');
                   return;
               }

               var formData=new FormData();
                 formData.append('verificationCode',verificationCode);
                 $.ajax({
                        url : ajaxUrl,
                        type : 'POST',  
                        data :formData,                     
                        processData : false, 
                        contentType : false,  
                        success : function(data) {
                            if(data.success){
                                $.toast('注册成功');
                            }else{
                                $.toast(data.errMsg);
                            }
                        $('#kaprchaImg').click();  
                        }
                    });

最后后台在判断前台的验证码和图片的是否一致

/**
     * 后台获取验证码的信息和前台的验证码对比
     * @param request
     * @return
     */
    public static boolean checkVerifyCode(HttpServletRequest request) {
        String verifyCodeExpected = (String) request.getSession().getAttribute(
                com.google.code.kaptcha.Constants.KAPTCHA_SESSION_KEY);
       String verifyCodeActual =request.getparamete("verificationCode");
        if (verifyCodeActual == null
                || !verifyCodeActual.equalsIgnoreCase(verifyCodeExpected)) {
            return false;
        }
        return true;
    }

@RequestMapping(value="insertShop", method = RequestMethod.POST)
    @ResponseBody
    public Map<String,Object> insertShop(@RequestParam(value = "shopImg", required = false)MultipartFile shopImg,HttpServletRequest request){
        Map<String,Object> modelMap=new HashMap<String,Object>(); 
        if(!CodeUtil.checkVerifyCode(request)) {
            modelMap.put("success", false);
            modelMap.put("errMsg", "验证码错误");
            return modelMap;
        }
        return modelMap;
    }