javascript - 防止通过后退按钮重新提交表单+刷新/重试

标签 javascript jquery html progress-4gl webspeed

如果有人问过这个问题,我深表歉意,但我已经做了很多搜索,但还没有找到与我的问题类似的问题。

在我的应用程序中,我有一个密码更改页面,如果某人是新用户或重置了他/她的密码,该页面就会触发。

问题是,一旦用户进行更改并点击提交,他/她就会被重定向到主页。现在,如果用户多次点击后退按钮以进入密码更改页面,他们会遇到一个过期的页面,他们可以点击刷新。然后浏览器要求用户重试提交数据。这个提交请求是一个POST,可以在数据包中看到用户之前输入的原始数据。

到目前为止,我只能在 IE 上重现这个问题..在 FF 和 Chrome 上试过了,但没有。

我的问题是,有没有办法使用 jQuery、HTML、WSS 或其他方式来防止重新提交此 POST?我最关心的是带有可见数据的数据包。

谢谢。

最佳答案

这种问题的一个非常通用的解决方案是 Post/Redirect/Get 模式。

这意味着当您想对一个页面执行 POST 操作以在后台更新某些内容时,您实际上创建了两个目标页面:

页码 1

POST 的目标页面。包含更新数据库/文件系统/API 或任何需要完成的逻辑。这只是一个没有任何真实视觉反馈的 URL,而是在逻辑完成后将您重定向到第 2 页(见下文)。重定向是一个简单的 GET 而不是 POST。

页码 2

一个页面,显示您对“第 1 页”上的操作的反馈。可能只是一条消息“密码更新成功”或来自数据库的实际数据或任何适合您的信息。

现在,当有人使用您的表单时,他们将被发布到将执行后台操作的第 1 页,然后他们将被重定向到第 2 页。

现在,如果他们重新加载,他们将不会重做整个逻辑部分,而只会重做反馈部分。

维基百科对此有很好的解释:

https://en.wikipedia.org/wiki/Post/Redirect/Get

如何在 Progress WebSpeed 中进行重定向

在你的 outputHeader-procedure 或你做的任何地方

output-content-type ("text/html":U).

相反,如果输出内容类型:首先执行您的逻辑,然后插入如下内容:

OUTPUT-HTTP-HEADER("Status", "301").
OUTPUT-HTTP-HEADER("Location","http://www.yoursite.com/newurl").
OUTPUT-HTTP-HEADER("","").

现在,一旦逻辑处理完毕,您将被重定向到服务器端。如果需要,您还可以在 url 中插入参数:

DEFINE VARIABLE iId as INTEGER NO-UNDO.
OUTPUT-HTTP-HEADER("Status", "301").
OUTPUT-HTTP-HEADER("Location","http://www.yoursite.com/newurl?id=" + STRING(iId)).
OUTPUT-HTTP-HEADER("","").

关于javascript - 防止通过后退按钮重新提交表单+刷新/重试,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32897673/

相关文章:

javascript - 使用 $compile 创建指令,并立即获取 DOM 属性

javascript - 添加带有输入文本框和不带有输入文本框的表格列单元格

javascript - 禁用 md-tab 中的 Md-(上一个/下一个)按钮

javascript - 将 getIntersect(arr1, arr2) Javascript 函数转换为任意数量的参数并在 JQuery 中

html - 嵌入YouTube视频默认播放HD720

html - CSS:悬停时更改div的位置

javascript - 版本升级后球体上的纹理模糊

javascript - 用 Java 解析 JavaScript

javascript - 是否可以在 BABYLON.js 中对 3D 形状进行分组

php - 将数据追加到现有元素数据而不清除 div