谷歌kaptcha图片验证码的使用
谷歌验证码 kaptcha 使用步骤如下:
1、导入谷歌验证码的 jar 包
kaptcha-2.3.2.jar
2、在 web.xml 中去配置用于生成验证码的 Servlet 程序
1 <servlet> 2 <servlet-name>KaptchaServlet</servlet-name> 3 <servlet-class>com.google.code.kaptcha.servlet.KaptchaServlet</servlet-class> 4 </servlet> 5 6 <servlet-mapping> 7 <servlet-name>KaptchaServlet</servlet-name> 8 <url-pattern>/kaptcha.jpg</url-pattern> 9 </servlet-mapping>
测试: http://localhost:8080/book/kaptcha.jpg
3、在表单中使用img标签去显示验证码并使用它
新建kaptcha.jsp
1 <%@ page contentType="text/html;charset=UTF-8" language="java" %> 2 <html> 3 <head> 4 <title>kaptcha</title> 5 </head> 6 <body> 7 8 <form action="http://localhost:8080/book/testServlet" method="get"> 9 用户名:<input type="text" name="username" > <br> 10 验证码:<input type="text" style=" 80px;" name="code"> 11 <img src="http://localhost:8080/book/kaptcha.jpg" alt="" style=" 100px; height: 28px;"> <br> 12 <input type="submit" value="登录"> </form> 13 </body> 14 </html>
4、在服务器获取谷歌生成的验证码和客户端发过来的验证码比较使用
新建TestServlet.java
1 package com.gychen.web; 2 3 import javax.servlet.ServletException; 4 import javax.servlet.http.HttpServlet; 5 import javax.servlet.http.HttpServletRequest; 6 import javax.servlet.http.HttpServletResponse; 7 import java.io.IOException; 8 9 import static com.google.code.kaptcha.Constants.KAPTCHA_SESSION_KEY; 10 11 public class TestServlet extends HttpServlet { 12 protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { 13 14 //获取Session中的验证码 15 String token = (String) request.getSession().getAttribute(KAPTCHA_SESSION_KEY); 16 17 request.getSession().invalidate(); 18 //获取验证码 19 String code = request.getParameter("code"); 20 21 //获取用户名 22 String username = request.getParameter("username"); 23 24 if (token != null && token.equalsIgnoreCase(code)){ 25 System.out.println("保存到数据库"+username); 26 response.sendRedirect(request.getContextPath()+"/pages/test/ok.jsp"); 27 }else { 28 29 if (token != null && !token.equalsIgnoreCase(code)){ 30 System.out.println("验证码错误"); 31 } 32 33 else { 34 System.out.println("请不要重复提交表单"); 35 } 36 } 37 } 38 39 40 }
5、以图书项目为例:
1 /** 2 * 处理注册功能 3 */ 4 protected void regist(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException{ 5 6 //获取Session中的验证码 7 String token = (String) req.getSession().getAttribute(KAPTCHA_SESSION_KEY); 8 //删除Session中的验证码,或者销毁 9 req.getSession().removeAttribute(KAPTCHA_SESSION_KEY); 10 11 // 1、获取请求参数 12 String username = req.getParameter("username"); 13 String password = req.getParameter("password"); 14 // String repwd = req.getParameter("repwd"); 15 String email = req.getParameter("email"); 16 String verification_code = req.getParameter("verification_code"); 17 18 //使用BeanUtils注入参数 19 // try { 20 // User user = new User(); 21 // System.out.println("参数注入前:"+user); 22 // /** 23 // * 把所有请求的参数都注入到user对象中 24 // */ 25 // BeanUtils.populate(user,req.getParameterMap()); 26 // System.out.println("参数注入之后:"+user); 27 // } catch (Exception e) { 28 // e.printStackTrace(); 29 // } 30 31 //使用封装好的bean工具类来注入参数 32 // //法一 33 // User user = new User(); 34 // WebUtils.copyParamToBean(req.getParameterMap(),user); 35 // //法二 36 // User user = (User) WebUtils.copyParamToBean(req.getParameterMap(),new User()); 37 38 //法三 39 User user = WebUtils.copyParamToBean(req.getParameterMap(),new User()); 40 41 //保存用户信息到Sesion域中,为了注册完登陆后显示用户名 42 req.getSession().setAttribute("user",user); 43 44 // 2、检查验证码是否正确 45 if (token != null && token.equalsIgnoreCase(verification_code)){ 46 47 // Ⅰ、正确 48 49 // 3、检查用户名是否可用 50 if(userService.existUsername(username)){ 51 // ①、不可用 52 // 跳回注册页面 53 System.out.println("用户名["+username+"]已存在"); 54 //把错误信息和回显保存到Request域中 55 req.setAttribute("registError","用户名已存在"); 56 req.setAttribute("username",username); 57 req.setAttribute("email",email); 58 req.getRequestDispatcher("/pages/user/regist.jsp").forward(req,resp); 59 }else{ 60 // ②、可用 61 System.out.println("用户名["+username+"]可用"); 62 // 调用Service保存到数据库 63 userService.registUser(new User(null,username,password,email)); 64 // 跳到注册成功页面 65 req.getRequestDispatcher("/pages/user/regist_success.jsp").forward(req,resp); 66 } 67 68 }else if (token != null && !token.equalsIgnoreCase(verification_code)){ 69 // Ⅱ、错误 70 // 跳回注册页面 71 System.out.println("验证码错误["+verification_code+"]错误"); 72 //把错误信息和回显保存到Request域中 73 req.setAttribute("registError","验证码错误"); 74 req.setAttribute("username",username); 75 req.setAttribute("email",email); 76 req.getRequestDispatcher("/pages/user/regist.jsp").forward(req,resp); 77 }else if (token ==null){ 78 79 //Ⅲ、重复提交 80 //跳回注册页面 81 System.out.println("表单重复提交"); 82 //把错误信息和回显保存到Request域中 83 req.setAttribute("registError","表单重复提交"); 84 req.setAttribute("username",username); 85 req.setAttribute("email",email); 86 req.getRequestDispatcher("/pages/user/regist.jsp").forward(req,resp); 87 } 88 }
1 <label>验证码:</label> 2 <input class="itxt" type="text" name="verification_code" style=" 100px;" id="code"/> 3 <img alt="" src="kaptcha.jpg" style="float: right; margin-right: 0px; 110px;height: 30px;"> 4 <br />
6、点击验证码图片刷新验证码
1 <script type="text/javascript"> 2 // 页面加载完成之后 3 $(function () { 4 5 /** 6 * 给验证码图片添加单击事件 7 */ 8 $("#code_img").click(function () { 9 //this.src表示img标签的src属性,可读可写 10 //加时间戳是为了兼容IE和火狐点击不重新访问的问题。有缓存,请求参数一样的话会先从缓存里找 11 this.src = "${pageScope.basePath}kaptcha.jpg?=" + new Date(); 12 }); 13 14 }); 15 16 </script>