Kaptcha实现的验证码功能

验证码分析

1.    选型

经过在github和google code上搜索之后，初步选择了两种方案：jQuery.buttonCaptcha 和 kaptcha。

jQuery.buttonCaptcha需要引用jquery一系列文件，对于没有采用jquery的系统中会造成加载资源过多，影响页面速度。

Kaptcha使用java来生成验证码，可配置(自定义)验证码的类型(中文，字母，数字)、字体类型、字体颜色、图片的宽度和高度、图片边框、干扰线、样式等。可配置，因此使用方便；而且支持扩展。

基于以上判断，我建议使用kaptcha。

2.    Kaptcha的使用

Kaptcha使用很方便，通过servlet来访问。在web项目中，可以这样配置。

<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.border.color</param-name>

<param-value>105,179,90</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>200</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>40</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>仿宋_GB2312</param-value>

</init-param>

</servlet>

<servlet-mapping>

<servlet-name>kaptcha</servlet-name>

<url-pattern>/kaptcha.jpg</url-pattern>

</servlet-mapping>

在页面中，可以这样使用

<img src="../kaptcha.jpg"id="aptcha">

Kaptcha在生成验证码图片的同时，会将验证码的内容放入session中，key是com.google.code.kaptcha.Constants.KAPTCHA_SESSION_KEY。这样，我们就可以在服务端验证用户输入的验证码是否正确了。

以上配置是针对普通web项目的，如果采用了spring mvc框架的项目，要采取另外一种配置方式，这种配置方式session中无法获得验证码的值。

在spring mvc中，要为它单独配置一个controller

首先新建一个文件 applicationContext-kaptcha.xml

<?xmlversion="1.0" encoding="UTF-8"?>

<beansxmlns="http://www.springframework.org/schema/beans"

xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xmlns:context="http://www.springframework.org/schema/context"

xsi:schemaLocation="http://www.springframework.org/schema/beans

http://www.springframework.org/schema/beans/spring-beans-2.5.xsd

http://www.springframework.org/schema/context

http://www.springframework.org/schema/context/spring-context-2.5.xsd">

<beanid="captchaProducer" class="com.google.code.kaptcha.impl.DefaultKaptcha">

<propertyname="config">

<beanclass="com.google.code.kaptcha.util.Config">

<constructor-arg>

<props>

<propkey="kaptcha.border">no</prop>

<propkey="kaptcha.border.color">105,179,90</prop>

<propkey="kaptcha.textproducer.font.color">blue</prop>

<propkey="kaptcha.image.width">130</prop>

<propkey="kaptcha.textproducer.font.size">30</prop>

<propkey="kaptcha.image.height">40</prop>

<propkey="kaptcha.textproducer.char.length">4</prop>

<propkey="kaptcha.textproducer.font.names">宋体,楷体,微软雅黑</prop>

</props>

</constructor-arg>

</bean>

</property>

</bean>

</beans>

之后，新建一个controller

package cn.com.gei.htic.platform.portal.controller;

 

importjava.awt.image.BufferedImage;

 

import javax.imageio.ImageIO;

importjavax.servlet.ServletOutputStream;

importjavax.servlet.http.HttpServletRequest;

importjavax.servlet.http.HttpServletResponse;

 

importorg.springframework.beans.factory.annotation.Autowired;

importorg.springframework.stereotype.Controller;

importorg.springframework.web.bind.annotation.RequestMapping;

importorg.springframework.web.servlet.ModelAndView;

 

importcom.google.code.kaptcha.Constants;

importcom.google.code.kaptcha.Producer;

 

@Controller

@RequestMapping("/kaptcha")

@Controller

public classKaptchaController {

privateProducer captchaProducer = null;

 

@Autowired

publicvoid setCaptchaProducer(Producer captchaProducer) {

this.captchaProducer= captchaProducer;

}

 

@RequestMapping("/captcha-image")

publicModelAndView handleRequest(HttpServletRequest request,

            HttpServletResponse response) throws Exception {

 

        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("image/jpeg");

        // create the text for the image

        String capText = captchaProducer.createText();

        // store the text in the session

        request.getSession().setAttribute(Constants.KAPTCHA_SESSION_KEY,

                capText);

        // create the image 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;

    }

}

然后新建一个aptcha-servlet.xml，放在WEB-INF下

<?xmlversion="1.0" encoding="UTF-8"?>

<beansxmlns="http://www.springframework.org/schema/beans"

    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"

    xmlns:p="http://www.springframework.org/schema/p"

    xmlns:context="http://www.springframework.org/schema/context"

    xsi:schemaLocation="http://www.springframework.org/schema/beans

    http://www.springframework.org/schema/beans/spring-beans-3.0.xsd

    http://www.springframework.org/schema/context

    http://www.springframework.org/schema/context/spring-context-3.0.xsd">

    <context:component-scan

        base-package=" cn.com.gei.htic.platform.portal.controller"/>

    <bean

        class="org.springframework.web.servlet.mvc.annotation.AnnotationMethodHandlerAdapter"/>

    <bean id="viewResolver"

        class="org.springframework.web.servlet.view.UrlBasedViewResolver">

        <property name="viewClass"

            value="org.springframework.web.servlet.view.JstlView"/>

        <property name="prefix"value="/WEB-INF/jsp/attachment/" />

        <property name="suffix" value=".jsp"/>

    </bean>

</beans>

最后在web.xml中配置

<servlet>

        <servlet-name>aptcha</servlet-name>

        <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>

        <load-on-startup>1</load-on-startup>

</servlet>

<servlet-mapping>

        <servlet-name>aptcha</servlet-name>

        <url-pattern>/aptcha/*</url-pattern>

</servlet-mapping>

 

在页面中，可以通过如下方式来使用：

<img src="/kaptcha/captcha-image"></img>

参考：http://ttaale.iteye.com/blog/808719

3.    与Spring Security结合

这里 的与Spring Security结合，是指登录页面的验证码验证问题。

首先在Spring Security的配置文件中增加如下内容：

<intercept-url pattern="/aptcha/captcha-image"filters="none" />

意思是不对验证码进行权限验证

之后要自定义一个filter

在<http></http>中增加

<custom-filterref="aptchaFilter" position="PRE_AUTH_FILTER" />

PRE_AUTH_FILTER的意思是在Spring Security验证之前进行的验证，具体可以参考这里

http://static.springsource.org/spring-security/site/docs/3.0.x/reference/preauth.html

之后增加aptchaFilter的定义

<b:beanid="aptchaFilter"

        class="cn.com.gei.kmp4.kjjexternal.security.filter.AptchaFilter">

    <b:property name="authenticationManager"ref="authenticationManager"></b:property>

    <b:property name="authenticationSuccessHandler"ref="loginSuccessHandler"></b:property>

    <b:property name="authenticationFailureHandler"ref="simpleUrlAuthenticationFailureHandler"></b:property>

</b:bean>

<b:beanid="simpleUrlAuthenticationFailureHandler"

        class="org.springframework.security.web.authentication.SimpleUrlAuthenticationFailureHandler">

    <b:property name="defaultFailureUrl"value="/home/index"></b:property>

</b:bean>

引用的authenticationManager是别名

<authentication-manageralias="authenticationManager">

<authentication-providerref="daoAuthenticationProvider">

</authentication-provider>

</authentication-manager>

其中loginSuccessHandler可以采用kmp4默认的。

AptchaFilter的定义如下：

public class AptchaFilterextends UsernamePasswordAuthenticationFilter {

 

    @Override

    public Authentication attemptAuthentication(HttpServletRequestrequest,

            HttpServletResponse response) throws AuthenticationException{

        checkValidateCode(request);

        return super.attemptAuthentication(request, response);

    }

 

    protected void checkValidateCode(HttpServletRequest request) {

        String sessionValidateCode =obtainSessionValidateCode(request);

        String validateCodeParameter =obtainValidateCodeParameter(request);

        if (sessionValidateCode != null

                &&!sessionValidateCode.equalsIgnoreCase(validateCodeParameter)) {

            throw new AuthenticationServiceException(messages

                    .getMessage("validateCode.notEquals"));

        }

    }

 

    private String obtainSessionValidateCode(HttpServletRequestrequest) {

        HttpSession session = request.getSession(true);

        String code = (String) session

                .getAttribute(Constants.KAPTCHA_SESSION_KEY);

        return code;

    }

 

    private String obtainValidateCodeParameter(HttpServletRequestrequest) {

      //yanzheng 是页面中验证码输入框的name

        return request.getParameter("yanzheng");

    }

}

此filter继承自 UsernamePasswordAuthenticationFilter,重写了attemptAuthentication方法，在此方法中，我们可以增加对验证码的验证逻辑

如果验证失败，则抛出AuthenticationServiceException异常，异常的提示信息可以结合本地message策略，在org/springframework/security/messages_zh_CN.properties中增加一条，这里采用的是

validateCode.notEquals    验证码不正确

通过配置simpleUrlAuthenticationFailureHandler，我们就可以在这个filter验证失败后，将页面重定向到登录页面，从而实现验证码的验证了。

4.    参数含义

 

Constant	Description	Default
常数	描述	默认值
kaptcha.border	有无边框，选项是yes或者no	Yes
kaptcha.border.color	边框颜色。可选值为red,green,blue 或者white,black,blue	Black
kaptcha.border.thickness	边框厚度，可选值为大于0的整数	1
kaptcha.image.width	图片宽度(像素)	200
kaptcha.image.height	图片高度(像素)	50
kaptcha.producer.impl	图片生产者	com.google.code.kaptcha.impl.DefaultKaptcha  （可自定义，实现Producer接口即可）
kaptcha.textproducer.impl	字体产生者	com.google.code.kaptcha.text.impl.DefaultTextCreator(可自定义，实现TextProducer接口即可)
kaptcha.textproducer.char.string	图片内容从这些字符中产生	abcde2345678gfynmnpwx
kaptcha.textproducer.char.length	图片内容的长度	5
kaptcha.textproducer.font.names	图片字体名，用逗号隔开。	Arial, Courier
kaptcha.textproducer.font.size	图片字体大小	40px
kaptcha.textproducer.font.color	图片字体颜色，可选值为red,green,black等	black
kaptcha.textproducer.char.space	字符之间空格数	2
kaptcha.noise.impl	噪度生产者	com.google.code.kaptcha.impl.DefaultNoise (可自定义，实现NoiseProducer接口即可)
kaptcha.noise.color	噪度颜色，可选值为red,green,black等	Black
kaptcha.obscurificator.impl	模糊度实现者	com.google.code.kaptcha.impl.WaterRipple (可自定义，实现GimpyEngine接口即可)
kaptcha.background.impl	背景实现者	com.google.code.kaptcha.impl.DefaultBackground(可自定义，实现BackgroundProducer接口即可)
kaptcha.background.clear.from	背景颜色开始值，可选值是red,green,blue等	Light grey
kaptcha.background.clear.to	背景颜色结束值，可选值是red,green,blue	White
kaptcha.word.impl	字体渲染实现者	com.google.code.kaptcha.text.impl.DefaultWordRenderer(可自定义，实现WordRenderer接口即可)
kaptcha.session.key	验证码内容生成后会放入HttpSession中，这是内容在session中的key值	KAPTCHA_SESSION_KEY (程序有bug，建议不要配，程序中可通过session.getAttribute(Constants.KAPTCHA_SESSION_KEY)来取)
kaptcha.session.date	验证码生成的日期会放入HttpSession中，这是日期在session中的key值	KAPTCHA_SESSION_DATE

 

5.    刷新验证码

// 点击刷新验证码

   $(function(){

      $('#id_captchaImage').click(function(){

          $(this).hide().attr('src','/kaptcha/captcha-image?'+ Math.floor(Math.random()*100)).fadeIn();

      });

   });