zoukankan      html  css  js  c++  java
  • 防止表单重复提交

    一、防止表单重复提交一

      网络延迟,在网络延迟时间内,频繁的提交表单
       只能提交一次,监控表单的提交事件,通过一个boolean类型的变量来区分已经点击过还是没有点击,如果已经点击过,表单就不提交,没有点击过再提交

    1、目录展示

      

    2、导入依赖

      

    3、form.jsp

    <%--
      Created by IntelliJ IDEA.
      User: zheng
      Date: 2020/2/6
      Time: 15:55
      To change this template use File | Settings | File Templates.
    --%>
    <%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <html>
    <head>
        <title>解决表单重复提交案例</title>
        <script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
        <script type="text/javascript">
            //创建一个变量   false代表没有点击过,true代表已经点击过
            var flag=false;
            function formSubmit() {
                if(!flag){      //取反值为false
                    flag=true;
                    return true;
                }else {
                    return false;
                }
            }
        </script>
    </head>
    <body>
        <form action="FormServlet" method="post">
            内容:<input type="text" name="username"/>
            <input type="submit" value="提交"/>
        </form>
    </body>
    </html>

    4、FormServlet

    package com.b;
    
    import javax.servlet.ServletException;
    import javax.servlet.annotation.WebServlet;
    import javax.servlet.http.HttpServlet;
    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;
    import java.io.IOException;
    
    @WebServlet("/FormServlet")
    public class FormServlet extends HttpServlet {
        protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
            doGet(request,response);
        }
    
        protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
            //接收数据
            String username = request.getParameter("username");
            System.out.println("接收的数据:"+username);
    
            try {
                //模拟网络延迟
                Thread.sleep(300);
            } catch (InterruptedException e) {
                e.printStackTrace();
            }
            //返回数据
            response.getWriter().write("success");
        }
    }

    5、效果展示(只允许一次提交)

      

      

      

    二、重新加载或者后退页面

      思路如下:在访问登录页面的时候,创建一个 Token令牌(当作一个标识) ,保存到session当中,然后在表单提交的时候将令牌一起提交
       后台Servlet去判断session当中的令牌和表单提交的令牌是否相等,如果相等代表正常提交(session清空),如果不相等,代表非正常提交

    1、目录展示

      

    2、导入依赖

      

    3、TokenForm.jsp

    <%--
      Created by IntelliJ IDEA.
      User: zheng
      Date: 2020/2/6
      Time: 15:55
      To change this template use File | Settings | File Templates.
    --%>
    <%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <html>
    <head>
        <title>解决表单重复提交案例</title>
        <script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
        <script type="text/javascript">
            //创建一个变量   false代表没有点击过,true代表已经点击过
            var flag=false;
            function formSubmit() {
                if(!flag){      //取反值为false
                    flag=true;
                    return true;
                }else {
                    return false;
                }
            }
            $(function () {
                //生成令牌
                $.ajax({
                    url:"TokenServlet",
                    type:"POST",
                    success:function (token) {
                        $("#hiddenToken").val(token);
                        alert(token)
                    }
                })
            })
        </script>
    </head>
    <body>
        <form action="FormServlet" method="post">
            内容:<input type="text" name="username"/>
            <input type="submit" value="提交"/>
        </form>
    </body>
    </html>

    4、TokenServlet

    package com.b;
    
    import javax.servlet.ServletException;
    import javax.servlet.annotation.WebServlet;
    import javax.servlet.http.HttpServlet;
    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;
    import java.io.IOException;
    import java.util.UUID;
    
    @WebServlet("/TokenServlet")
    public class TokenServlet extends HttpServlet {
        protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
            doGet(request,response);
        }
    
        protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
            //生成令牌
            String token = UUID.randomUUID().toString();
            //令牌保存到session当中
            request.getSession().setAttribute("sessionToken",token);
            //响应
            response.getWriter().write(token);
        }
    }

    5、TokenFormServlet

    package com.b;
    
    import javax.servlet.ServletException;
    import javax.servlet.annotation.WebServlet;
    import javax.servlet.http.HttpServlet;
    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;
    import java.io.IOException;
    
    @WebServlet("/TokenFormServlet")
    public class TokenFormServlet extends HttpServlet {
        protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
            doGet(request,response);
        }
    
        protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
            //验证令牌
            //获取页面提交的隐藏域数据
            String formToken = request.getParameter("formToken");
            //获取Session中的token
            Object sessionToken = request.getSession().getAttribute("sessionToken");
            //如果页面获取的喝session中不一样,代表已经提交过了,不能重复提交
            if (!formToken.equals(sessionToken)){
                System.out.println(sessionToken);
                response.getWriter().write("不能重复提交!");
                return;
            }
    
    
            //接收数据
            String username = request.getParameter("username");
            System.out.println("接收的数据:"+username);
    
            try {
                //模拟网络延迟
                Thread.sleep(300);
            } catch (InterruptedException e) {
                e.printStackTrace();
            }
            //返回数据
            response.getWriter().write("success");
        }
    }

    6、效果展示

      

       

       

  • 相关阅读:
    MVC4 Action 两种异步方式
    MVC4 Model ValueProvider
    MVC4 Model ControllerDescriptor
    MVC4 基于 Unity Ioc 框架的 ControllerFactory
    MVC4 路由解析 同名Controller的解决方案
    ASP.NET mvc4 Controllder 同步还是异步
    Asp.net MVC 自定义路由
    Xml读取
    Leetcode 1029. 可被 5 整除的二进制前缀
    Leetcode 1014. 在 D 天内送达包裹的能力
  • 原文地址:https://www.cnblogs.com/Zzzzn/p/12269140.html
Copyright © 2011-2022 走看看