如何停止重新提交表单的“后退”和“刷新”按钮?

时间:2009-03-20 09:01:29

标签: javascript browser double-submit-prevention

我在做网络开发。

我有一个与信用卡有关的页面,当用户点击“刷新”或“返回”时,交易将再次执行,这是不需要的。

这包括浏览器左上角“后退”& “刷新”按钮,“右键单击 - >刷新/返回”,按“F5”键。 这只能在某个cgi页面上完成,而不是全部。

可以使用Javascript完成吗?还是其他方法?

13 个答案:

答案 0 :(得分:48)

standard way分三个步骤完成。

  1. 表单页面将字段提交到处理页面
  2. 处理页面处理数据并重定向到结果页面
  3. 结果页面只显示结果,重新加载它不会造成任何伤害。

答案 1 :(得分:11)

这打破了基本的浏览器用户体验模型......用户应始终能够在浏览器中使用“刷新”和“返回”按钮。建议您以其他方式修复页面。

如果您更新问题以包含您正在使用的服务器语言/平台/技术,那么有人可能会建议解决方案。

答案 2 :(得分:8)

重新提交表单生成重复事务的简单事实令人担忧。您应该进行某种检查以确保每次提交表单数据都是唯一的。

例如,提交表单的页面应该被赋予一个随表单提交的唯一ID。然后,业务逻辑应该能够识别提交的表单已经处理(因为(不再)唯一ID将是相同的),因此忽略第二次尝试。

“标准方式”仍然不能阻止客户点击两次后退按钮......如果他们不认为(无论出于何种原因)它已被处理,甚至可以返回并重新提交表单。

答案 3 :(得分:5)

  1. 生成随机字符串并将其存储在会话中

  2. 然后将其作为隐藏值输出到您的表单

  3. 检查提交和存储变量,如果匹配处理您的请求,

  4. 转到1.

答案 4 :(得分:3)

将此代码放在表单页面

Response.Cache.SetCacheability(HttpCacheability.NoCache);

Response.Cache.SetExpires(DateTime.Now-new TimeSpan(1,0,0));

Response.Cache.SetLastModified(DateTime.Now);

Response.Cache.SetAllowResponseInBrowserHistory(false);

答案 5 :(得分:2)

你不应该试图“阻止”这些行动。 你应该做的是确保当有人“双提交”表格时没有任何事情发生。

答案 6 :(得分:1)

在某些浏览器中你甚至不能这样做,这很好!

答案 7 :(得分:1)

最好的方法是拥有足够的会话处理逻辑,您可以将第二次(以及之后的)尝试识别为“这只是一次重新提交”并忽略它。

答案 8 :(得分:1)

我在这里没有看到这一点,所以在这里。

  1. 在表单中添加唯一标记。
  2. 提交按钮会向服务器触发xmlhttp(ajax)请求,以创建一个以存储值为1的令牌命名的会话变量。
  3. ajax请求在收到正状态更改后提交表单。
  4. 表单处理脚本使用存储的值1检查会话变量。
  5. 该脚本删除会话变量并处理表单。
  6. 如果未找到会话变量,则不会处理表单。由于变量在找到后立即被删除,因此只能通过按下提交按钮来运行该表单。刷新并返回不会提交表单。这将在不使用重定向的情况下工作。

答案 9 :(得分:0)

vartec:s解决方案解决了重载问题,而不是后端问题,所以这里有一个解决方案:

  1. 表单页面设置会话变量,例如session(“fromformpage”)= 1
  2. 处理页面检查会话变量,如果其为“1”,则处理数据并重定向到结果页面,如果除了“1”以外,则只需重定向到结果页面。
  3. 结果页面将会话变量设置为“”。
  4. 然后,如果用户按下后退按钮,处理页面将不会再次执行该过程,只会重定向到进程页面。

答案 10 :(得分:0)

我发现上面的帖子/重定向/获取解释有点含糊不清

以下是我所遵循的内容,希望将来可以帮助某人

http://wordsideasandthings.blogspot.ca/2013/04/post-redirect-get-pattern-in-php.html

基本上基于上述解决方案的过程是:

  1. 从FORM页面提交到处理页面(或自身)
  2. 处理数据库或付款处理等
  3. 如果需要,将用户反馈消息存储在会话变量中,可能出现错误消息等
  4. 执行标题重定向到结果页面(或原始表单页面)。 如果需要,请显示处理页面中的自定义消息。例如“错误信用卡付款被拒绝”,并重置会话变量。
  5. 重定向,例如:

    header("HTTP/1.1 303 See Other");
    header("Location: http://$_SERVER[HTTP_HOST]/yourfilehere.php");
    die();
    

    标头重定向将在“yourfilehere.php”上发起GET请求,因为重定向就是从服务器获取数据的“请求”,而不是提交数据的POST到服务器。因此,重定向/ GET可防止刷新后进行任何进一步的数据库/支付处理。 301错误状态有助于按下后退按钮。

    有用的阅读:

    1. http://en.wikipedia.org/wiki/URL_redirection#HTTP_status_codes_3xx
    2. http://www.theserverside.com/news/1365146/Redirect-After-Post
    3. http://wordsideasandthings.blogspot.ca/2013/04/post-redirect-get-pattern-in-php.html
    4. https://en.wikipedia.org/wiki/HTTP#Request_methods
    5. http://en.wikipedia.org/wiki/Post/Redirect/Get

答案 11 :(得分:0)

只需将此javascript放在主题部分

上方的aspx页面的html部分
<script type = "text/javascript" >
function disableBackButton()
{
window.history.forward();
}
setTimeout("disableBackButton()", 0);
</script>

我们需要将它放在页面的html部分,我们希望通过点击后退按钮阻止用户访问

页面的完整代码如下所示

<%@ Page Language="C#" AutoEventWireup="true"
CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
<script type = "text/javascript" >
function disableBackButton()
{
window.history.forward();
}
setTimeout("disableBackButton()", 0);
</script>
</head>
<body onload="disableBackButton()">
<form id="form1" runat="server">
<div>
This is First page <br />
<br />
Go to Second page
<br />
<br />
<asp:LinkButton ID="LinkButton1" runat="server"
PostBackUrl="~/Default2.aspx">Go to Second Page
</asp:LinkButton></div>
</form>
</body>
</html>
  

如果您使用的是firefox,请使用而不是onload

如果要使用aspx页面后面的代码禁用后退按钮,则需要编写下面提到的代码 C#代码背后

protected override void OnPreRender(EventArgs e)
{
base.OnPreRender(e);
string strDisAbleBackButton;
strDisAbleBackButton = "<script language="javascript">\n";
strDisAbleBackButton += "window.history.forward(1);\n";
strDisAbleBackButton += "\n</script>";
ClientScript.RegisterClientScriptBlock(this.Page.GetType(), "clientScript", strDisAbleBackButton);
} 

我们也可以通过在Page_load事件或Page_Init事件中编写此行代码来禁用浏览器缓存或缓存来实现此目的

protected void Page_Init(object Sender, EventArgs e)
{
Response.Cache.SetCacheability(HttpCacheability.NoCache);
Response.Cache.SetExpires(DateTime.Now.AddSeconds(-1));
Response.Cache.SetNoStore();
}
  

这样做,当用户点击浏览器按钮时,用户将看到页面已过期消息

演示是:

enter image description here

答案 12 :(得分:0)

此代码不适用于当前页面。

这里我放了一个代码可以帮助你,而不是打开contextmenu和浏览器重新加载请你留下一个页面......

我正在尝试点击浏览器后退按钮

jQuery( document ).ready(function() {

    document.onkeydown = fkey;
    document.onkeypress = fkey
    document.onkeyup = fkey;

    var wasPressed = false;

    function fkey(e){
        e = e || window.event;
        //alert(e.keyCode);
        if( wasPressed ) return; 


        if (e.keyCode == 116 || e.keyCode == 8 || e.keyCode == 17) {
                     // alert("f5 pressed");
                      window.onbeforeunload = null;
                      return true;
                 }

    }
window.onbeforeunload = function (event) {
    var message = ''; // Type message here

    if (typeof event == 'undefined') {
        event = window.event;
    }
    if (event) {
        event.returnValue = message;
    }

    return message;
};

jQuery(function () {

    jQuery("a").click(function () {
        window.onbeforeunload = null;
    });

    jQuery(".btn").click(function () {
        window.onbeforeunload = null;
    });

    //Disable part of page
    $(document).on("contextmenu",function(e){
        return false;
    });
});});

谢谢,