常见表单重复提交问题整理及解决方法


Posted in Javascript onNovember 13, 2013

/**
*
* @authors Benjamin
* @date 2013-11-13 10:16:59
*/

一、常见的重复提交问题
a>点击提交按钮两次。
b>点击刷新按钮。
c>使用浏览器后退按钮重复之前的操作,导致重复提交表单。
d>使用浏览器历史记录重复提交表单。
e>浏览器重复的HTTP请求。

二、防止表单重复提交的方法

a>禁掉提交按钮。表单提交后disabled现在的按钮或者取消该按钮的点击事件或者默认事件。这种方法防止心急的用户多次点击按钮。但有个问题,如果在客户端把Javascript给禁止掉,这种方法就无效了,当然现代的web站点来说,应该很少了。

b>Post/Redirect/Get模式。在提交后执行页面重定向,这就是所谓的Post-Redirect-Get (PRG)模式。简言之,当用户提交了表单后,你去执行一个客户端的重定向,转到提交成功信息页面。这能避免用户按F5导致的重复提交,而其也不会出现浏览器表单重复提交的警告,也能消除按浏览器前进和后退按导致的同样问题。

c>使用cookie处理表单重复提交

PHP中的实现:

lt;?php 

 if(isset($_POST['go'])){ 

 setcookie("tempcookie","",time()+30); 

 header("Location:".$_SERVER[PHP_SELF]);exit(); 

 } if(isset($_COOKIE["tempcookie"])){ 

 setcookie("tempcookie","",0);echo "您已经提交过表单"; 

 } 

 ?>

d>在session中存放一个特殊标志。当表单页面被请求时,生成一个特殊的字符标志串,存在session中,同时放在表单的隐藏域里。接受处理表单数据时,检查标识字串是否存在,并立即从session中删除它,然后正常处理数据。如果发现表单提交里没有有效的标志串,这说明表单已经被提交过了,忽略这次提交。这使你的web应用有了更高级的XSRF保护。

e>在数据库里添加约束。在数据库里添加唯一约束或创建唯一索引,防止出现重复数据。这是最有效的防止重复提交数据的方法。

Javascript 相关文章推荐
AutoSave/自动存储功能实现
Mar 24 Javascript
JSON 入门指南 想了解json的朋友可以看下
Aug 26 Javascript
JavaScript 组件之旅(三):用 Ant 构建组件
Oct 28 Javascript
jquery图片不完全按比例自动缩小的简单代码
Jul 29 Javascript
7个让JavaScript变得更好的注意事项
Jan 28 Javascript
分享12个实用的jQuery代码片段
Mar 09 Javascript
vue.js入门教程之绑定class和style样式
Sep 02 Javascript
vue2.0 + element UI 中 el-table 数据导出Excel的方法
Mar 02 Javascript
Vue项目中跨域问题解决方案
Jun 05 Javascript
vue 解决uglifyjs-webpack-plugin打包出现报错的问题
Aug 04 Javascript
React 条件渲染最佳实践小结(7种)
Sep 27 Javascript
详解Javascript实践中的命令模式
May 05 Javascript
获取下拉列表框的值是数组,split,$.inArray示例
Nov 13 #Javascript
jquery属性选择器not has怎么写 行悬停高亮显示
Nov 13 #Javascript
jquery validate在ie8下的bug解决方法
Nov 13 #Javascript
JQuery伸缩导航练习示例
Nov 13 #Javascript
JS:window.onload的使用介绍
Nov 13 #Javascript
JQuery each打印JS对象的方法
Nov 13 #Javascript
Jquery 数组操作大全个人总结
Nov 13 #Javascript
You might like
如何跨站抓取别的站点的页面的补充
2006/10/09 PHP
PHP扩展模块memcached长连接使用方法分析
2014/12/24 PHP
php类自动装载、链式操作、魔术方法实现代码
2017/07/23 PHP
laravel中Redis队列监听中断的分析
2020/09/14 PHP
用JavaScript脚本实现Web页面信息交互
2006/12/21 Javascript
IE与firefox之jquery用法区别
2008/10/03 Javascript
JavaScript判断用户是否对表单进行了修改的方法
2015/03/18 Javascript
javascript实现五星评分功能
2015/11/10 Javascript
JavaScript知识点整理
2015/12/09 Javascript
jquery实现可旋转可拖拽的文字效果代码
2016/01/27 Javascript
JavaScript的ExtJS框架中表格的编写教程
2016/05/21 Javascript
Bootstrap图片轮播组件Carousel使用方法详解
2016/10/20 Javascript
探讨跨域请求资源的几种方式(总结)
2016/12/02 Javascript
vue2.0结合DataTable插件实现表格动态刷新的方法详解
2017/03/17 Javascript
Angular 4.x+Ionic3踩坑之Ionic3.x pop反向传值详解
2018/03/13 Javascript
JavaScript Blob对象原理及用法详解
2020/10/14 Javascript
[01:59]游戏“zheng”当时试玩会
2019/08/21 DOTA
Python实现的多线程同步与互斥锁功能示例
2017/11/30 Python
python进行文件对比的方法
2018/12/24 Python
对Python信号处理模块signal详解
2019/01/09 Python
Django uwsgi Nginx 的生产环境部署详解
2019/02/02 Python
Python将字符串常量转化为变量方法总结
2019/03/17 Python
pybind11在Windows下的使用教程
2019/07/04 Python
使用TensorFlow直接获取处理MNIST数据方式
2020/02/10 Python
TensorFlow tf.nn.conv2d_transpose是怎样实现反卷积的
2020/04/20 Python
利用Python实现朋友圈中的九宫格图片效果
2020/09/03 Python
使用python爬取抖音app视频的实例代码
2020/12/01 Python
css 元素选择器的简单实例
2016/05/23 HTML / CSS
为什么说Ruby是一种真正的面向对象程序设计语言
2012/10/30 面试题
班长竞选演讲稿
2014/04/24 职场文书
四风对照检查剖析材料
2014/10/07 职场文书
2014年教研员工作总结
2014/12/23 职场文书
2015年学校教育教学工作总结
2015/04/22 职场文书
60条职场经典语录,总有一条能触动你的心
2019/08/21 职场文书
再谈python_tkinter弹出对话框创建
2022/03/20 Python
在NumPy中深拷贝和浅拷贝相关操作的定义和背后的原理
2022/04/14 Python