Spring MVC+Kaptcha實現驗證碼功能

一、kaptcha簡介

kaptcha 是一個非常實用的驗證碼生成工具。有了它,你可以生成各種樣式的驗證碼,因爲它是可配置的。kaptcha工作的原理是調用 com.google.code.kaptcha.servlet.KaptchaServlet,生成一個圖片。

同時將生成的驗證碼字符串放到 HttpSession中。

使用kaptcha可以方便的配置:

  • 驗證碼的字體

  • 驗證碼字體的大小

  • 驗證碼字體的字體顏色

  • 驗證碼內容的範圍(數字,字母,中文漢字!)

  • 驗證碼圖片的大小,邊框,邊框粗細,邊框顏色

  • 驗證碼的干擾線(可以自己繼承com.google.code.kaptcha.NoiseProducer寫一個自定義的干擾線)

  • 驗證碼的樣式(魚眼樣式、3D、普通模糊……當然也可以繼承com.google.code.kaptcha.GimpyEngine自定義樣式)


二、生成驗證碼的案例

開發環境:eclipse、spring mvc、kaptcha、maven

  1. 下載kaptcha的依賴包

    1. 下載地址:http://code.google.com/p/kaptcha/downloads/list ,由於一些衆所周知的原因我們訪問google的網頁的速度是比較慢的。

    2. 添加到本地maven倉庫

mvn install:install-file -DgroupId=com.google.code -DartifactId=kaptcha -Dversion=2.3.2 -Dfile=D:\kaptcha-2.3.jar -Dpackaging=jar -DgeneratePom=true


配置maven依賴

在現有的maven工程的pom文件中配置相應的依賴信息

<!-- 驗證碼插件kaptcha -->
<dependency>  
        <groupId>com.google.code</groupId>  
        <artifactId>kaptcha</artifactId>  
        <version>2.3.2</version>  
 </dependency>


配置spring環境

applicationContext.xml文件配置

<!-- 頁面生成隨機驗證碼 -->
    <bean id="captchaProducer" class="com.google.code.kaptcha.impl.DefaultKaptcha">  
        <property name="config">  
            <bean class="com.google.code.kaptcha.util.Config">  
                <constructor-arg>  
                    <props>  
                        <prop key="kaptcha.border">no</prop>  
                        <prop key="kaptcha.border.color">105,179,90</prop>  
                        <prop key="kaptcha.textproducer.font.color">red</prop>  
                        <prop key="kaptcha.p_w_picpath.width">105</prop>  
                        <prop key="kaptcha.textproducer.font.size">36</prop>  
                        <prop key="kaptcha.p_w_picpath.height">36</prop>  
                        <prop key="kaptcha.session.key">code</prop>  
                        <prop key="kaptcha.textproducer.char.length">4</prop>  
                        <prop key="kaptcha.textproducer.font.names">宋體,楷體,微軟雅黑</prop>  
                    </props>  
                </constructor-arg>  
            </bean>  
        </property>  
    </bean>
Controller編寫package com.exiao.damao.platform.api.supplier.controller; import java.awt.p_w_picpath.BufferedImage; import java.util.HashMap; import java.util.Map; import javax.p_w_picpathio.ImageIO; import javax.servlet.ServletOutputStream; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import javax.servlet.http.HttpSession; import org.slf4j.Logger; import org.slf4j.LoggerFactory; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.RequestMethod; import org.springframework.web.bind.annotation.RestController; import org.springframework.web.servlet.ModelAndView; import com.google.code.kaptcha.Constants; import com.google.code.kaptcha.Producer; /**  * 防止Captcha機器人登陸  * @author huang han chao  *  */ @RestController public class CaptchaController {      Logger logger=LoggerFactory.getLogger(CaptchaController.class);     @Autowired     private Producer captchaProducer = null;     //生成驗證碼     @RequestMapping("/kaptcha/getKaptchaImage")     public ModelAndView getKaptchaImage(HttpServletRequest request, HttpServletResponse response) throws Exception {         HttpSession session = request.getSession();         String code = (String)session.getAttribute(Constants.KAPTCHA_SESSION_KEY); //        System.out.println("******************驗證碼是: " + code + "******************");         logger.debug("******************驗證碼是: " + code + "******************");                  response.setDateHeader("Expires", 0);                  // Set standard HTTP/1.1 no-cache headers.         response.setHeader("Cache-Control", "no-store, no-cache, must-revalidate");                  // Set IE extended HTTP/1.1 no-cache headers (use addHeader).         response.addHeader("Cache-Control", "post-check=0, pre-check=0");                  // Set standard HTTP/1.0 no-cache header.         response.setHeader("Pragma", "no-cache");                  // return a jpeg         response.setContentType("p_w_picpath/jpeg");                  // create the text for the p_w_picpath         String capText = captchaProducer.createText();          //        System.out.println("******************新的驗證碼是: " + capText + "******************");         logger.debug("******************新的驗證碼是: " + capText + "******************");         // store the text in the session         session.setAttribute(Constants.KAPTCHA_SESSION_KEY, capText);                  // create the p_w_picpath with the text         BufferedImage bi = captchaProducer.createImage(capText);         ServletOutputStream out = response.getOutputStream();                  // write the data out         ImageIO.write(bi, "jpg", out);         try {             out.flush();         } finally {             out.close();         }         return null;     }          //校驗驗證碼     @RequestMapping(value = "/kaptcha/checkRandCode", method = RequestMethod.GET)     public void checkRandCode(HttpServletRequest request,HttpServletResponse response) {         Map<String, Object> map = new HashMap<String, Object>();         try {             String randCode = request.getParameter("randCode");             logger.info("randCode: " +randCode);             String status = "false";             String code = (String)request.getSession().getAttribute(com.google.code.kaptcha.Constants.KAPTCHA_SESSION_KEY);             if(randCode.toLowerCase().equals(code.toLowerCase()))status="true";             logger.debug("驗證信息:"+status);         } catch (Exception ex) {             logger.error(ex.getMessage(), ex);         }      } }jsp頁面<%@ page language="java" contentType="text/html; charset=UTF-8"     pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/functions.js"></script> <title>測試頁面</title> <script type="text/javascript"> $(function(){            $('#kaptchaImage').click(function () {//生成驗證碼         $(this).hide().attr('src', '../kaptcha/getKaptchaImage.do?' + Math.floor(Math.random()*100) ).fadeIn();         event.cancelBubble=true;     }); });  window.onbeforeunload = function(){     //關閉窗口時自動退出     if(event.clientX>360&&event.clientY<0||event.altKey){            alert(parent.document.location);     } }; function changeCode() {     $('#kaptchaImage').hide().attr('src', '../kaptcha/getKaptchaImage.do?' + Math.floor(Math.random()*100) ).fadeIn();     event.cancelBubble=true; } </script> </head> <body> <form action="./kaptcha/checkRandCode" > <div class="chknumber">       <label>驗證碼:       <input name="randCode" type="text" id="kaptcha" maxlength="4" class="chknumber_input" />                    </label>       <br />       <img src="./kaptcha/getKaptchaImage.do" id="kaptchaImage"  style="margin-bottom: -3px"/>              <a href="#" onclick="changeCode()">看不清?換一張</a>       <button type="submit">提交</button>        </div> </form> </body> </html>


kaptcha可配置項

kaptcha.border  是否有邊框  默認爲true  我們可以自己設置yes,no
kaptcha.border.color   邊框顏色   默認爲Color.BLACK
kaptcha.border.thickness  邊框粗細度  默認爲1
kaptcha.producer.impl   驗證碼生成器  默認爲DefaultKaptcha
kaptcha.textproducer.impl   驗證碼文本生成器  默認爲DefaultTextCreator
kaptcha.textproducer.char.string   驗證碼文本字符內容範圍  默認爲abcde2345678gfynmnpwx
kaptcha.textproducer.char.length   驗證碼文本字符長度  默認爲5
kaptcha.textproducer.font.names    驗證碼文本字體樣式  默認爲new Font("Arial", 1, fontSize), new Font("Courier", 1, fontSize)
kaptcha.textproducer.font.size   驗證碼文本字符大小  默認爲40
kaptcha.textproducer.font.color  驗證碼文本字符顏色  默認爲Color.BLACK
kaptcha.textproducer.char.space  驗證碼文本字符間距  默認爲2
kaptcha.noise.impl    驗證碼噪點生成對象  默認爲DefaultNoise
kaptcha.noise.color   驗證碼噪點顏色   默認爲Color.BLACK
kaptcha.obscurificator.impl   驗證碼樣式引擎  默認爲WaterRipple
kaptcha.word.impl   驗證碼文本字符渲染   默認爲DefaultWordRenderer
kaptcha.background.impl   驗證碼背景生成器   默認爲DefaultBackground
kaptcha.background.clear.from   驗證碼背景顏色漸進   默認爲Color.LIGHT_GRAY
kaptcha.background.clear.to   驗證碼背景顏色漸進   默認爲Color.WHITE
kaptcha.p_w_picpath.width   驗證碼圖片寬度  默認爲200
kaptcha.p_w_picpath.height  驗證碼圖片高度  默認爲50

上面只是相應的配置,如有遺漏請自行處理。下面是我之前參考的文章,對部分信息有所修改。


參考文章:http://www.cnblogs.com/liuhongfeng/p/4702566.html


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章