2019独角兽企业重金招聘Python工程师标准>>> 
kaptcha是一个简单好用的验证码生成工具，通过配置，可以自己定义验证码大小、颜色、显示的字符等等。下面就来讲一下如何使用kaptcha生成验证码以及在服务器端取出验证码进行校验。
一、搭建测试环境
1.1、创建Web测试项目
新建一个Web项目，并将kaptcha-2.3.2.jar放在项目的WEB-INF/lib目录下，如下图所示：
1.2、在web.xml文件配置生成验证码的KaptchaServlet
KaptchaServlet的详细配置如下：
1 xml version="1.0" encoding="UTF-8"?>
2 <web-app version="2.5"
3 xmlns="http://java.sun.com/xml/ns/javaee"
4 xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
5 xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
6 http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
7 <welcome-file-list>
8 <welcome-file>index.jspwelcome-file>
9 welcome-file-list>
10
11
12 <servlet>
13
14 <servlet-name>Kaptchaservlet-name>
15 <servlet-class>com.google.code.kaptcha.servlet.KaptchaServletservlet-class>
16
17
18 <init-param>
19 <param-name>kaptcha.borderparam-name>
20 <param-value>noparam-value>
21 init-param>
22
23 <init-param>
24 <param-name>kaptcha.textproducer.font.colorparam-name>
25 <param-value>redparam-value>
26 init-param>
27
28 <init-param>
29 <param-name>kaptcha.image.widthparam-name>
30 <param-value>135param-value>
31 init-param>
32
33 <init-param>
34 <param-name>kaptcha.textproducer.char.stringparam-name>
35 <param-value>ACDEFHKPRSTWX345679param-value>
36 init-param>
37
38 <init-param>
39 <param-name>kaptcha.image.heightparam-name>
40 <param-value>50param-value>
41 init-param>
42
43 <init-param>
44 <param-name>kaptcha.textproducer.font.sizeparam-name>
45 <param-value>43param-value>
46 init-param>
47
48 <init-param>
49 <param-name>kaptcha.noise.colorparam-name>
50 <param-value>blackparam-value>
51 init-param>
52
53 <init-param>
54 <param-name>kaptcha.textproducer.char.lengthparam-name>
55 <param-value>4param-value>
56 init-param>
57
58 <init-param>
59 <param-name>kaptcha.textproducer.font.namesparam-name>
60 <param-value>Arialparam-value>
61 init-param>
62 servlet>
63
64 <servlet-mapping>
65 <servlet-name>Kaptchaservlet-name>
66 <url-pattern>/Kaptcha.jpgurl-pattern>
67 servlet-mapping>
68 web-app>1.3、显示生成的验证码
在页面index.jsp显示验证码
1 <%@ page language="java" pageEncoding="UTF-8"%>
2 DOCTYPE HTML>
3 <html>
4 <head>
5 <title>显示KaptchaServlet生成的验证码title>
6 <script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-1.9.1.js">script>
7 <script type="text/javascript">
8 //点击切换验证码
9 function changeVerifyCode(){
10 $("#yzmImg").attr("src","Kaptcha.jpg?"+Math.floor(Math.random()*100));
11 }
12
13 //提交
14 function doSubmit() {
15 var verifyCodeValue = $("#verifyCode").val();
16 if(verifyCodeValue.replace(/\s/g,"") == "") {
17 alert("请输入验证码");
18 }else {
19 //提交前先异步检查验证码是否输入正确
20 var verifyUrl = "${pageContext.request.contextPath}/servlet/VerifyServlet?verifyCode="+verifyCodeValue;
21 $.ajax({
22 type:"GET",
23 url:verifyUrl,
24 success:function(returnData){
25 if(returnData!="Y") {
26 alert("请输入正确的验证码！");
27 }else {
28 //验证码正确，进行提交操作
29 alert("验证码输入正确，提交表单");
30 }
31 },
32 error:function(e){
33 alert(e);
34 }
35 });
36 }
37 }
38 script>
39 head>
40
41 <body>
42 <form>
43 <table>
44 <tr>
45 <td>
46 请输入验证码：
47 td>
48 <td>
49 <input type="text" name="verifyCode" id="verifyCode">
50 <img src="Kaptcha.jpg" onclick="changeVerifyCode()" id="yzmImg" style="cursor: pointer;">
51 <a href="javascript:void(0)" onclick="changeVerifyCode()">看不清，换一张a>
52 td>
53 tr>
54 <tr>
55 <td>
56
57 td>
58 <td>
59 <input type="button" value="提交" onclick="doSubmit()">
60 td>
61 tr>
62 table>
63 form>
64 body>
65 html>运行效果如下图所示：
1.4、在服务器端验证提交的验证码
用户在form表单中提交了验证码之后，我们会在服务器端进行验证，编写一个VerifyServlet，代码如下：
1 /**
2 *
3 */
4 package me.gacl.web.controller;
5
6 import java.io.IOException;
7 import java.io.PrintWriter;
8
9 import javax.servlet.ServletException;
10 import javax.servlet.http.HttpServlet;
11 import javax.servlet.http.HttpServletRequest;
12 import javax.servlet.http.HttpServletResponse;
13
14 public class VerifyServlet extends HttpServlet {
15
16
17 public void doGet(HttpServletRequest request, HttpServletResponse response)
18 throws ServletException, IOException {
19
20 response.setContentType("text/html;charaset=utf-8");
21 response.setHeader("pragma", "no-cache");
22 response.setHeader("cache-control", "no-cache");
23 PrintWriter out = null;
24 try {
25 //响应数据
26 String resultData;
27 //获取传过来的验证码
28 String verifyCode = request.getParameter("verifyCode");
29 System.out.println("verifyCode----"+verifyCode);
30 if(verifyCode=="") {
31 resultData = "N";
32 }else {
33 //获取kaptcha生成存放在session中的验证码
34 String kaptchaValue = (String) request.getSession().getAttribute(com.google.code.kaptcha.Constants.KAPTCHA_SESSION_KEY);
35 //比较输入的验证码和实际生成的验证码是否相同
36 if(kaptchaValue == null || kaptchaValue == ""||!verifyCode.equalsIgnoreCase(kaptchaValue)) {
37 resultData = "N";
38 }else {
39 resultData = "Y";
40 }
41 }
42 out = response.getWriter();
43 out.write(resultData);
44 out.flush();
45 }catch(Exception e) {
46 e.printStackTrace();
47 }finally {
48 if(out != null) {
49 out.close();
50 }
51 }
52 }
53 }在web.xml中注册VerifyServlet
1
2 <servlet>
3 <servlet-name>VerifyServletservlet-name>
4 <servlet-class>me.gacl.web.controller.VerifyServletservlet-class>
5 servlet>
6 <servlet-mapping>
7 <servlet-name>VerifyServletservlet-name>
8 <url-pattern>/servlet/VerifyServleturl-pattern>
9 servlet-mapping>运行结果如下：
1、验证码不输入
2、输入错误的验证码
3、输入正确的验证码
使用kaptcha生成验证码感觉挺不错的，非常好用和方便。