客户端防表单重复提交和服务器端防重复提交

以你之姓@ 2022-06-09 23:36 276阅读 0赞

# 客户端防表单重复提交和服务器端防重复提交 #

## 客户端防表单重复提交 ##

为了防止用户在客户端重复提交表单，要分析从客户端和服务端对重复提交的表单就行处理，首先是客户端处理重复提交表单，使用JavaScript方法，第一种是只允许表单提交一次，后来的不能再提交，第二种是提交一次后按钮变成不可用，下面是代码的实现

<html>  
    <head>  
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
    <title>Insert title here</title>  
    <script type="text/javascript">  
     
     var isCommit = false;  
     function doSubmit1(){  
        if(! isCommit){  
        isCommit = true;  
            return true;  
        }   else{  
        return false;  
        }  
     } 
     function doSubmit2(){//使提交按钮再提交完成后不可用  
        var input = document.getElementById("submit");  
        input.disabled='disabled';  
        return true;  
     }  
    </script>  
      
      
    </head>  
    <body>  
    <form action="/GetData.aspx" method="post" οnsubmit="return doSubmit()">  
    用户名:<input type="text" name="username"><br>  
    <input id="submit" type="submit" value="提交" >  
    </form>  
    </body>  
    </html>

客户端防表单重复提交还有一种方式就是由服务端生成一个唯一标识的token,服务端保存，同时发给客户端，客户端提交数据的时候包含该token,客户端提交一次后清除该token,服务端需检测该token是否处理过，一般不推荐这种做法，这样客户端同服务端多了一次交互。

## 服务器端防重复提交       ##

但是仅仅在客户端进行处理是远远不够的，这叫只能防的了君子防不了小人，因为可以根据服务器的提交地址自己写一个表单或者去掉JavaScript代码进行自己的提交，这样仍旧无法阻止客户端的表单的重复提交。

### 第一种方式，先判断存在与否 ###

有种有问题的做法是这样的，比如是插入数据到db的，在插入前查询数据库根据业务特征判断该记录是否存在，不存在则插入，貌似没问题，其实在客户端在很多情况下会有重复提交的情况，当第一个请求到了，但数据还没插入到db,第二个请求也来了，查询数据库时同样还是没有，  
但当插入数据库时，前一个请求的插入可能已经执行，这样二个同样的数据都插入了db,除非在db上加了唯一索引，这样第二个请求插入db时会报异常，处理掉这个异常即可  
  
这种先查询db，再操作的也可以结合lock来做，检查及插入包含在lock块中，这种情况lock块中的逻辑不要太复杂，耗时太多会让其它的请求等待，并发性能就低了。

### 第二种方式，利用缓存来做判断 ###

根据上面的问题有一种做法是在接收到请求时在缓存中保存一个值（要能判别是否重复数据），在做数据处理前判断该缓存是否存在，不存在则处理，存在则说明是重复数据。这种方式在绝大时候是行得通的，因为缓存操作够快,但还是有机率出现重复操作的问题，除非还得加一个全局锁

在判断前先获取锁，拿到锁的进入下一步，处理完了释放锁

\--- end ---