本文共 2810 字，大约阅读时间需要 9 分钟。

表单重复提交之-----验证码

表单重复提交有三种常见的情况：

• 一：提交完表单。服务器使用请求转来进行页面跳转。这个时候，用户按下功能键 F5，就会发起最后一次的请求。 造成表单重复提交问题。
  解决方法：使用重定向来进行跳转
• 二：用户正常提交服务器，但是由于网络延迟等原因，迟迟未收到服务器的响应，这个时候，用户以为提交失败， 就会着急，然后多点了几次提交操作，也会造成表单重复提交。
• 三：用户正常提交服务器。服务器也没有延迟，但是提交完成后，用户回退浏览器。重新提交。也会造成表单重复 提交
  解决方法：动态验证码
  

谷歌 kaptcha 图片验证码的使用

谷歌验证码 kaptcha 使用步骤如下：

   
       
    
     KaptchaServlet
        
    
     com.google.code.kaptcha.servlet.KaptchaServlet
    
   
       
    
     KaptchaServlet
        
    
     /kaptcha.jpg
    
   

3、在表单中使用 img 标签去显示验证码图片并使用它：

验证码：看不清换一张

4、在服务器获取谷歌生成的验证码和客户端发送过来的验证码比较使用。

import static com.google.code.kaptcha.Constants.KAPTCHA_SESSION_KEY;  protected void regist(HttpServletRequest req, HttpServletResponse resp) throws Exception {
           // 获取Session中的验证码        String seCode = (String) req.getSession().getAttribute(KAPTCHA_SESSION_KEY);        // 删除 Session中的验证码        req.getSession().removeAttribute(KAPTCHA_SESSION_KEY);        //  1、获取请求的参数        String username = req.getParameter("username");        String password = req.getParameter("password");        String email = req.getParameter("email");        String code = req.getParameter("code");        System.out.println(username);        User user = WebUtils.copyParamToBean(req.getParameterMap(),new User());//        2、检查 验证码是否正确        if(seCode != null && seCode.equalsIgnoreCase(code)){
   //            3、检查 用户名是否可用            if(userService.existsUsername(username)){
   //                // 把回显信息，保存到Request域中                req.setAttribute("msg","用户名已存在!!!");                req.setAttribute("username",username);                req.setAttribute("email",email);                //        跳回注册页面                req.getRequestDispatcher("/pages/user/myregist.jsp").forward(req, resp);            }else{
                   //      可用//                调用service保存到数据库//                userService.registUser(new User(null,username,password,email));               userService.registUser(user);                // 保存用户注册的信息到Session域中               req.getSession().setAttribute("user",user);                //        跳到注册成功页面 regist_success.jsp                req.getRequestDispatcher("/pages/user/regist_success.jsp").forward(req,resp);            }        }else{
               // 把回显信息，保存到Request域中            req.setAttribute("msg","验证码错误!!!");            req.setAttribute("username",username);            req.setAttribute("email",email);            //请求转发必须要以斜杠打头，/ 斜杠表示地址为：http://ip:port/工程名/            req.getRequestDispatcher("/pages/user/myregist.jsp").forward(req,resp);        }    }}

切换验证码：

// 给验证码的图片，绑定单击事件$("#changeCode").click(function () {    // src属性表示验证码img标签的 图片路径。它可读，可写    var $codeImg = $("#code_img");    $codeImg[0].src = "${basePath}kaptcha.jpg?time=" + new Date();});

转载地址：http://uquki.baihongyu.com/