利用Kaptcha实现验证码的功能

1.导入kaptcha相关的jar包，maven项目的话在pom.xml文件中添加一下配置：

		<!-- 验证码 -->
		<dependency>
			<groupId>com.github.penggle</groupId>
			<artifactId>kaptcha</artifactId>
			<version>2.3.2</version>
		</dependency>

2.在web.xml文件中配置验证码的样式以及URL映射：

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

3.在前端页面中显示验证码：

<!-- 验证码：kaptcha -->
						<li>
							<div class="item-content">
								<div class="item-media">
									<i class="icon icon-form-email"></i>
								</div>
								<div class="item-inner">
									<label for="j_captcha" class="item-title label">验证码</label> <input
										id="j_captcha" name="j_captcha" type="text"
										class="form-control in" placeholder="验证码" />
									<div class="item-input">
										<img id="captcha_img" alt="点击更换" title="点击更换"
											onclick="changeVerifyCode(this)" src="../Kaptcha" />
									</div>
								</div>
							</div>
						</li>

4.完善changeVerifyCode（this）js的函数实现点击更换验证码的功能：

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

完成上述代码后已经可以在前端页面中看到后台所发送过去的验证码，但还无法判断该验证码与用户所输入的是否一致：

5.编写JS获得用户在文本框中所输入的验证码并以JSON形式发送到后台：

var formData = new FormData();
var verifyCodeActual = $('#j_captcha').val();
		if (!verifyCodeActual) {
			$.toast('请输入验证码！');
			return;
		}
		formData.append("verifyCodeActual", verifyCodeActual);
		$.ajax({
			url : registerShpUrl,
			type : 'POST',
			// contentType: "application/x-www-form-urlencoded; charset=utf-8",
			data : formData,
			contentType : false,
			processData : false,
			cache : false,
			success : function(data) {
				if (data.success) {
					$.toast('提交成功！');
					/*
					 * if (isEdit){ $('#captcha_img').click(); } else{
					 * window.location.href="/shop/shoplist"; }
					 */
				} else {
					$.toast('提交失败！');
					$('#captcha_img').click();
				}
			}
		});

６.在后台判断两验证码是否一致：

 public static boolean checkVerifyCode(HttpServletRequest request) {
        // 从HttpSession中获得后台所生成的验证码
        String verifyCodeExpected = (String) request.getSession().getAttribute(
                com.google.code.kaptcha.Constants.KAPTCHA_SESSION_KEY);
        // 获得用户输入的验证码
        String verifyCodeActual = HttpServletRequestUtil.getString(request,
                "verifyCodeActual");
        if (verifyCodeActual == null
                || !verifyCodeActual.equalsIgnoreCase(verifyCodeExpected)) {
            return false;
        }
        return true;
    }

/**
     * @Title: getString   
     * @Description: 从request域中获取指定的Key的值并转换成字符串形式
     * @param: @param request
     * @param: @param key
     * @param: @return      
     * @return: String      
     * @throws
     */
    public static String getString(HttpServletRequest request, String key) {
        try {
            String result = request.getParameter(key);
            if (result != null) {
                // 去掉左右两则的空格
                result = result.trim();
            }
            /*判断result是否为空，一般将result写在equals后面，"" 写在前面，
                                     否则result为空的话将会报错*/
            if ("".equals(result))
                result = null;
            return result;
        } catch (Exception e) {
            return null;
        }

    }

以上便是利用kaptcha实现验证码的完整步骤