单击后退按钮后如何停止重新提交表单

问题描述：

我有一个带有表单的JSP页面，您可以在其中填写某些详细信息.提交表单后，我将调用servlet，然后在更新数据库中的详细信息后重定向到页面，并向用户显示确认消息.

I have a JSP page with a form where you fill up certain details. On submitting the form i call a servlet which then updates details in a database after that i redirect to a page i display a confirmation message to the user.

我这里遇到的问题是，当用户单击返回时，他再次进入表单页面，如果他单击提交按钮，它将在数据库中创建新记录.

The problem i have here is when the user clicks back he goes to the form page again where if he clicks a submit button, it creates a new record in the database.

考虑这类似于购物车示例，在这种情况下，他将两次购买相同的商品.但是这里唯一的问题是我无法在后端处理此问题，即数据库永远无法知道正在进行冗余操作. 我需要从客户端进行处理.有点奇怪，但我必须这样做.

Consider this similar to a shopping cart example where in this case he would buy the same item twice. But the only problem here is i cannot handle this in backend, i.e. the database can never know a redundant operation is taking place. I need to handle this from the client side.Bit weird but i have to do it this way.

基本上，当用户单击后退"按钮时，我不希望他能够进入表单页面，而可能只是进入其他页面.

Basically when the user clicks the back button i don't want him to be able to go to the form page and may be just to some other page.

答

这是一个典型的HTML表单问题，您可以通过以下任何一种方法来解决它

This is a typical HTML form issue, you can solve it through any one of following methods

1)服务器端(页面到期):由于您已经提到页面刷新并转到确认页面.您可以设置no-cache并将页面过期时间添加为-1至拥有该表单的页面. 这样，当用户按下后退"按钮时，他将看到页面已过期.他将被迫重新加载页面.这是我在大多数银行网站上看到的行为.

1) Server side (page expiration): Since you've mentioned that the page refreshes and goes to the confirmation. You can set no-cache and add a page expiration time as -1 to the page you have that form. So that when user presses the back button, he will see that the page has expired. He will be forced to load the page freshly. This is the behavior that I see in most banking websites.

Response.Buffer = True
Response.ExpiresAbsolute = Now() - 1
Response.Expires = 0
Response.CacheControl = "no-cache"

2)使用转键方法:加载表单时，您可以在会话内存中生成随机密钥，也可以将其作为隐藏值嵌入页面中. 在提交表单期间，请对照会话中的值检查已提交的隐藏密钥.如果存在，则将条目添加到数据库中，否则，您可以为用户(可能是无意这样做的用户)使用新密钥重新加载页面.

2) Using turn Key method: When the form loads, you can generate a random key in session memory and also embed it as a hidden value in the page. During form submission, check the submitted hidden key against the value in session. If exists, then add the entry to database otherwise you can reload the page with a fresh key for the user (who might have done that unintentionally).

在负载平衡或Web场中，考虑对当前用户保留数据库中的交钥匙".

In load balanced or web farms, consider persisting the turn key in Database against the current user.

3)客户端(不推荐):您可以通过从历史记录中删除页面来限制用户使用浏览器后退按钮. (副作用是它将删除该浏览器标签/窗口的全部历史记录)

3) Client Side (Not recommended) : You can restrict the user from using the browser back button by removing the page from the history. (One side effect is that it will remove the entire history for that browser tab/window)

history.pushState(null, null, document.title);
window.addEventListener('popstate', function () {
    history.pushState(null, null, document.title);
});

如果您需要不支持推送和弹出状态的旧版浏览器相同的支持，则可以使用以下代码段.

If you need the same support for older browsers where push and pop states are not supported, you can use following snippet.

<script>
  function preventBack() {
    window.history.forward();
  }
  setTimeout("preventBack()", 0);
  window.onunload = function() {
    null
  };
</script>

单击后退按钮后如何停止重新提交表单

相关推荐