防止用户两次提交表单的好方法是什么？

Question

我有一个购买页面,我不希望用户能够刷新页面,并在他们到达"订购完成"页面后重新提交表单,因为它会自动通过数据库值在我们的系统中设置它们并向他们的卡收费通过paypal(只希望这些发生在一起)...我看到一些网站上写着"不要点击刷新,否则你会被收取两次费用!" 但是让它开放的可能性是非常蹩脚的,只允许一次提交或阻止它们刷新等的好方法是什么？

PS:我看到了一些类似的问题:PHP:当按下Back时停止表单被意外重新处理,如何停止重新提交表单后退和刷新按钮？但是没有找到令人满意的答案......如果有一个机制,ASP.NET MVC的具体答案也是理想的.

编辑:一旦他们点击提交它给我的控制器,然后控制器做了一些魔术,然后返回一个带有订单完成消息的视图,但是如果我点击我的浏览器上的刷新它会完成'你想要重新发送这个表单吗？ " 那很不好...

Answer 1

对此的标准解决方案是POST/REDIRECT/GET模式.这种模式可以使用几乎任何Web开发平台来实现.你通常会:

• POST后验证提交
• 如果失败则重新呈现原始输入表单并显示验证错误
• 如果成功,则重定向到确认页面或重新显示输入的页面 - 这是GET部分
• 由于最后一个操作是GET,如果用户此时刷新,则不会重新提交表单.

Answer 2

我100%同意RedFilter的通用答案,但希望专门为ASP.NET MVC发布一些相关代码.

您可以使用Post/Redirect/Get(PRG)模式来解决双重回发问题.

以下是问题的图解说明:

当用户点击刷新时,浏览器会尝试重新提交最后一次请求.如果最后一个请求是帖子,浏览器将尝试这样做.

大多数浏览器都知道这通常不是用户想要做的,因此会自动询问:

Chrome - 您要查找的页面使用了您输入的信息.返回该页面可能会导致您重复执行任何操作.你想继续吗？
Firefox - 要显示此页面,Firefox必须发送信息,以重复之前执行的任何操作(例如搜索或订单确认).
Safari - 您确定要再次发送表单吗？要重新打开此页面,Safari必须重新发送表单.这可能会导致重复购买,评论或其他操作.
Internet Explorer - 要再次显示网页,Web浏览器需要重新发送您之前提交的信息.如果您要进行购买,则应单击"取消"以避免重复交易.否则,请单击"重试"以再次显示该网页.

但PRG模式通过向客户端发送重定向消息来帮助完全避免这种情况,因此当页面最终出现时,浏览器执行的最后一个请求是对新资源的GET请求.

这是一篇关于PRG的精彩文章,它提供了MVC模式的实现.请务必注意,在服务器上执行非幂等操作时,您只需要求助于重定向.换句话说,如果您有一个有效的模型并且实际上以某种方式保留了数据,那么确保请求不会被意外提交两次非常重要.但是如果模型无效,则应返回当前页面和模型,以便用户进行任何必要的修改.

这是一个示例控制器:

[HttpGet]
public ActionResult Edit(int id) {
    var model = new EditModel();
    //...
    return View(model);
}

[HttpPost]
public ActionResult Edit(EditModel model) {
    if (ModelState.IsValid) {
        product = repository.SaveOrUpdate(model);
        return RedirectToAction("Details", new { id = product.Id });
    }
    return View(model);
}

[HttpGet]
public ActionResult Details(int id) {
    var model = new DetailModel();
    //...
    return View(model);
}