首页
学习
活动
专区
工具
TVP
发布

聊一聊表单重复提交

现在的 web 应用基本都是用表单来提交数据,在正常情况下,是木有任何问题的 ,但是在某些不正常情况下,表单就会被多次提交。

1

为什么会多次提交

1. 由于网络延迟,用户连续多次点击提交按钮。

2. 由于网络延迟,迟迟没有返回结果,用户直接刷新页面。

3. 表单提交成功以后,直接点击浏览器上后退按钮,不刷新页面,然后点击提交按钮再次提交表单。

2

多次提交的危害

1. 浪费网络资源。

2. 浪费服务器资源。

3. 数据库会产生多条数据记录,致使数据错乱。

3

解决方案

我们先来梳理下表单提交的流程,首先客户端请求获取表单页,然后用户填写数据,点击提交按钮,服务器接收并入库。那么我们就可以分别从客户端、服务端、数据库分别来处理这个 bug。

1. 用户提交完成之后,直接使用 JS 使提交按钮 disable,但是如果客户端禁止掉 JS 就无效了。

2. 提交完成之后客户端重定向到目标页面。这能避免用户刷新导致的重复提交,也能消除按浏览器后退按钮导致的同样问题。

3. Token 机制。客户端获取表单页时服务端生成一个随机字符串 token,存放在 session 中,同时存放在表单的隐藏域中,服务器接收到表单数据时,检查 token 是否跟 session 中的一致,若一致 ,则从 session 中清除,然后正常处理数据;如果不一致,则是重复提交,不予处理。

4. 数据库添加唯一约束或者做唯一索引,防止出现重复数据,最有效的方法。

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20180730G1GFRP00?refer=cp_1026
  • 腾讯「腾讯云开发者社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 cloudcommunity@tencent.com 删除。

扫码

添加站长 进交流群

领取专属 10元无门槛券

私享最新 技术干货

扫码加入开发者社群
领券