在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以为是自己没有提交表单,就会再点击提交按钮重复提交表单,我们在开发中必须防止表单重复提交。

一、表单重复提交的常见应用场景

有如下的form.jsp页面

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<!DOCTYPE HTML>

<html>

<head>

<title>Form表单</title>

</head>

<body>

<form action="${pageContext.request.contextPath}/servlet/DoFormServlet" method="post">

用户名:<input type="text" name="username">

<input type="submit" value="提交" id="submit">

</form>

</body>

</html>

 form表单提交到DoFormServlet进行处理

package xdp.gacl.session;

import java.io.IOException;

import javax.servlet.ServletException;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

public class DoFormServlet extends HttpServlet {

public void doGet(HttpServletRequest request, HttpServletResponse response)

throws ServletException, IOException {

//客户端是以UTF-8编码传输数据到服务器端的,所以需要设置服务器端以UTF-8的编码进行接收,否则对于中文数据就会产生乱码

request.setCharacterEncoding("UTF-8");

String userName = request.getParameter("username");

try {

//让当前的线程睡眠3秒钟,模拟网络延迟而导致表单重复提交的现象

Thread.sleep(3*1000);

} catch (InterruptedException e) {

e.printStackTrace();

}

System.out.println("向数据库中插入数据:"+userName);

}

public void doPost(HttpServletRequest request, HttpServletResponse response)

throws ServletException, IOException {

doGet(request, response);

}

}

如果没有进行form表单重复提交处理,那么在网络延迟的情况下下面的操作将会导致form表单重复提交多次

1.1、场景一:在网络延迟的情况下让用户有时间点击多次submit按钮导致表单重复提交

  演示动画如下所示:

1.2、场景二:表单提交后用户点击【刷新】按钮导致表单重复提交

演示动画如下所示:

 点击浏览器的刷新按钮,就是把浏览器上次做的事情再做一次,因为这样也会导致表单重复提交。

1.3、场景三:用户提交表单后,点击浏览器的【后退】按钮回退到表单页面后进行再次提交

演示动画如下所示:

二、利用JavaScript防止表单重复提交

  既然存在上述所说的表单重复提交问题,那么我们就要想办法解决,比较常用的方法是采用JavaScript来防止表单重复提交,具体做法如下:

修改form.jsp页面,添加如下的JavaScript代码来防止表单重复提交

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<!DOCTYPE HTML>

<html>

<head>

<title>Form表单</title>

<script type="text/javascript">

var isCommitted = false;//表单是否已经提交标识,默认为false

function dosubmit(){

if(isCommitted==false){

isCommitted = true;//提交表单后,将表单是否已经提交标识设置为true

return true;//返回true让表单正常提交

}else{

return false;//返回false那么表单将不提交

}

}

</script>

</head>

<body>

<form action="${pageContext.request.contextPath}/servlet/DoFormServlet" onsubmit="return dosubmit()" method="post">

用户名:<input type="text" name="username">

<input type="submit" value="提交" id="submit">

</form>

</body>

</html>

我们看看使用了JavaScript来防止表单提交重复是否可以成功,运行效果如下:

可以看到,针对"在网络延迟的情况下让用户有时间点击多次submit按钮导致表单重复提交"这个应用场景,使用JavaScript是可以解决这个问题的,解决的做法就是"用JavaScript控制Form表单只能提交一次"。

  除了用这种方式之外,经常见的另一种方式就是表单提交之后,将提交按钮设置为不可用,让用户没有机会点击第二次提交按钮,代码如下:

function dosubmit(){

//获取表单提交按钮

var btnSubmit = document.getElementById("submit");

//将表单提交按钮设置为不可用,这样就可以避免用户再次点击提交按钮

btnSubmit.disabled= "disabled";

//返回true让表单可以正常提交

return true;

}

运行效果如下:

动图

另外还有一种做法就是提交表单后,将提交按钮隐藏起来,这种做法和将提交按钮设置为不可用是差不多的,个人觉得将提交按钮隐藏影响到页面布局的美观,并且可能会让用户误以为是bug(怎么我一点击按钮,按钮就不见了呢?用户可能会有这样的疑问),我个人在开发中用得比较多的是表单提交后,将提交按钮设置为不可用,反正使用JavaScript防止表单重复提交的做法都是差不多的,目的都是让表单只能提交一次,这样就可以做到表单不重复提交了。

  使用JavaScript防止表单重复提交的做法只对上述提交到导致表单重复提交的三种场景中的【场景一】有效,而对于【场景二】和【场景三】是没有用,依然无法解决表单重复提交问题。

三、利用Session防止表单重复提交

  对于【场景二】和【场景三】导致表单重复提交的问题,既然客户端无法解决,那么就在服务器端解决,在服务器端解决就需要用到session了。

  具体的做法:在服务器端生成一个唯一的随机标识号,专业术语称为Token(令牌),同时在当前用户的Session域中保存这个Token。然后将Token发送到客户端的Form表单中,在Form表单中使用隐藏域来存储这个Token,表单提交的时候连同这个Token一起提交到服务器端,然后在服务器端判断客户端提交上来的Token与服务器端生成的Token是否一致,如果不一致,那就是重复提交了,此时服务器端就可以不处理重复提交的表单。如果相同则处理表单提交,处理完后清除当前用户的Session域中存储的标识号。
  在下列情况下,服务器程序将拒绝处理用户提交的表单请求:

  1. 存储Session域中的Token(令牌)与表单提交的Token(令牌)不同。

  2. 当前用户的Session中不存在Token(令牌)

  3. 用户提交的表单数据中没有Token(令牌)

看具体的范例:

  1.创建FormServlet,用于生成Token(令牌)和跳转到form.jsp页面

package xdp.gacl.session;

import java.io.IOException;

import javax.servlet.ServletException;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

public class FormServlet extends HttpServlet {

private static final long serialVersionUID = -884689940866074733L;

public void doGet(HttpServletRequest request, HttpServletResponse response)

throws ServletException, IOException {

String token = TokenProccessor.getInstance().makeToken();//创建令牌

System.out.println("在FormServlet中生成的token:"+token);

request.getSession().setAttribute("token", token);  //在服务器使用session保存token(令牌)

request.getRequestDispatcher("/form.jsp").forward(request, response);//跳转到form.jsp页面

}

public void doPost(HttpServletRequest request, HttpServletResponse response)

throws ServletException, IOException {

doGet(request, response);

}

}

2.在form.jsp中使用隐藏域来存储Token(令牌)

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<title>form表单</title>

</head>

<body>

<form action="${pageContext.request.contextPath}/servlet/DoFormServlet" method="post">

<%--使用隐藏域存储生成的token--%>

<%--

<input type="hidden" name="token" value="<%=session.getAttribute("token") %>">

--%>

<%--使用EL表达式取出存储在session中的token--%>

<input type="hidden" name="token" value="${token}"/>

用户名:<input type="text" name="username">

<input type="submit" value="提交">

</form>

</body>

</html>

 3.DoFormServlet处理表单提交

package xdp.gacl.session;

import java.io.IOException;

import javax.servlet.ServletException;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

public class DoFormServlet extends HttpServlet {

public void doGet(HttpServletRequest request, HttpServletResponse response)

throws ServletException, IOException {

boolean b = isRepeatSubmit(request);//判断用户是否是重复提交

if(b==true){

System.out.println("请不要重复提交");

return;

}

request.getSession().removeAttribute("token");//移除session中的token

System.out.println("处理用户提交请求!!");

}

/**

* 判断客户端提交上来的令牌和服务器端生成的令牌是否一致

* @param request

* @return

*         true 用户重复提交了表单

*         false 用户没有重复提交表单

*/

private boolean isRepeatSubmit(HttpServletRequest request) {

String client_token = request.getParameter("token");

//1、如果用户提交的表单数据中没有token,则用户是重复提交了表单

if(client_token==null){

return true;

}

//取出存储在Session中的token

String server_token = (String) request.getSession().getAttribute("token");

//2、如果当前用户的Session中不存在Token(令牌),则用户是重复提交了表单

if(server_token==null){

return true;

}

//3、存储在Session中的Token(令牌)与表单提交的Token(令牌)不同,则用户是重复提交了表单

if(!client_token.equals(server_token)){

return true;

}

return false;

}

public void doPost(HttpServletRequest request, HttpServletResponse response)

throws ServletException, IOException {

doGet(request, response);

}

}

生成Token的工具类TokenProccessor

package xdp.gacl.session;

import java.security.MessageDigest;

import java.security.NoSuchAlgorithmException;

import java.util.Random;

import sun.misc.BASE64Encoder;

public class TokenProccessor {

/*

*单例设计模式(保证类的对象在内存中只有一个)

*1、把类的构造函数私有

*2、自己创建一个类的对象

*3、对外提供一个公共的方法,返回类的对象

*/

private TokenProccessor(){}

private static final TokenProccessor instance = new TokenProccessor();

/**

* 返回类的对象

* @return

*/

public static TokenProccessor getInstance(){

return instance;

}

/**

* 生成Token

* Token:Nv6RRuGEVvmGjB+jimI/gw==

* @return

*/

public String makeToken(){  //checkException

//  7346734837483  834u938493493849384  43434384

String token = (System.currentTimeMillis() + new Random().nextInt(999999999)) + "";

//数据指纹   128位长   16个字节  md5

try {

MessageDigest md = MessageDigest.getInstance("md5");

byte md5[] =  md.digest(token.getBytes());

//base64编码--任意二进制编码明文字符   adfsdfsdfsf

BASE64Encoder encoder = new BASE64Encoder();

return encoder.encode(md5);

} catch (NoSuchAlgorithmException e) {

throw new RuntimeException(e);

}

}

}

首先访问FormServlet,在FormServlet中生成Token之后再重定向到form.jsp页面,这次是在服务器端处理表单重复提交的,

  从运行效果中可以看到,通过这种方式处理表单重复提交,可以解决上述的场景二和场景三中出现的表单重复提交问题。

JavaWeb---总结(十三)使用Session防止表单重复提交的更多相关文章

  1. (转)JavaWeb学习总结(十三)——使用Session防止表单重复提交

    如何防止表单重复提交 在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以为是自己没有提交表单,就会再点击提交按钮重复提交表单,我们在开发中必须防止表单重复 ...

  2. JavaWeb学习总结(十三)——使用Session防止表单重复提交

    在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以为是自己没有提交表单,就会再点击提交按钮重复提交表单,我们在开发中必须防止表单重复提交. 一.表单重复提 ...

  3. JavaWeb(十三)——使用Session防止表单重复提交

    在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以为是自己没有提交表单,就会再点击提交按钮重复提交表单,我们在开发中必须防止表单重复提交. 一.表单重复提 ...

  4. JavaWeb学习总结(十三)——使用Session防止表单重复提交(转)

    在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以为是自己没有提交表单,就会再点击提交按钮重复提交表单,我们在开发中必须防止表单重复提交. 一.表单重复提 ...

  5. java web学习总结(十三) -------------------使用Session防止表单重复提交

    在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以为是自己没有提交表单,就会再点击提交按钮重复提交表单,我们在开发中必须防止表单重复提交. 一.表单重复提 ...

  6. JavaWeb学习总结——使用Session防止表单重复提交

    在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以为是自己没有提交表单,就会再点击提交按钮重复提交表单,我们在开发中必须防止表单重复提交. 一.表单重复提 ...

  7. java web 学习十三(使用session防止表单重复提交)

    在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以为是自己没有提交表单,就会再点击提交按钮重复提交表单,我们在开发中必须防止表单重复提交. 一.表单重复提 ...

  8. javaWeb学习总结(7)- 使用Session防止表单重复提交

    在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以为是自己没有提交表单,就会再点击提交按钮重复提交表单,我们在开发中必须防止表单重复提交. 一.表单重复提 ...

  9. JavaWeb学习 (十二)————使用Session防止表单重复提交

    在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以为是自己没有提交表单,就会再点击提交按钮重复提交表单,我们在开发中必须防止表单重复提交. 一.表单重复提 ...

随机推荐

  1. C语言文件的读写

    对文件的读和写是最常用的文件操作.在C语言中提供了多种文件读写的函数: 字符读写函数  :fgetc和fputc 字符串读写函数:fgets和fputs 数据块读写函数:freed和fwrite 格式 ...

  2. ASimpleCache使用感受

    一.简介 ASimpleCache只能作为一份教程,一个学习样板,不能当真把它当回事. 作者杨福海,Afinal框架也是他创造的. 可是我读ASimpleCache的900行代码时,发现各种难看,并且 ...

  3. 十天冲刺---Day9

    站立式会议 站立式会议内容总结: 燃尽图 照片 队员们都回来了,写完之后继续对alpha版本进行迭代. 希望演示的时候能拿得出来.

  4. (02)javascript属性

    私有属性(私有变量和私有方法) 实例属性(实例变量和实例方法) 静态属性(静态变量和静态方法) <!DOCTYPE html> <html lang="en"&g ...

  5. 【CodeVS 3123】高精度练习之超大整数乘法 &【BZOJ 2197】FFT快速傅立叶

    第一次写法法塔,,,感到威力无穷啊 看了一上午算导就当我看懂了?PS:要是机房里能有个清净的看书环境就好了 FFT主要是用了巧妙的复数单位根,复数单位根在复平面上的对称性使得快速傅立叶变换的时间复杂度 ...

  6. nutch-介绍

    本文主要源于http://www.ibm.com/developerworks/cn/opensource/os-cn-nutchintro/ 基本信息 Nutch是一个开放源代码(open-sour ...

  7. 绘图: Shape, Path

    Shape - 图形 Path - 路径 示例1.演示“Shape”相关知识点Drawing/Shape.xaml <Page x:Class="Windows10.Drawing.S ...

  8. 系统间通信(9)——通信管理与RMI 下篇

    接上文<架构设计:系统间通信(8)--通信管理与RMI 上篇>.之前说过,JDK中的RMI框架在JDK1.1.JDK1.2.JDK1.5.JDK1.6+几个版本中做了较大的调整.以下我们讨 ...

  9. 使用IDEA和gradle搭建Spring MVC和MyBatis开发环境

    1. 概述 Gradle是一个基于Apache Ant和Apache Maven概念的项目自动化建构工具. 它使用一种基于Groovy的特定领域语言(DSL)来声明项目设置,抛弃了基于XML的各种繁琐 ...

  10. 关于js中"window.location.href"、"location.href"、"parent.location.href"、"top.location.href"的用法

    location.href 和 window.location.href 区别: 1.location.href 可以直接跳转其他地址(不属于本项目) 也可以跳转本项目中的 2.window.loca ...