如何阻止浏览器后退按钮重新显示我的用户通知？

Question

我已经为我一直在研究的ASP.NET MVC3站点构建了一个通知系统,让用户知道他们执行的各种操作成功发生了("拍拍背"消息).解决方案效果很好,但我有一个问题,我很乐意解决,但我似乎无法解决如何做到这一点.

在控制器中,我有以下示例操作方法:

<HttpGet()>
Public Function Edit(id As Guid) As ActionResult
    Return View(GetMyViewModel(id))
End Function

<HttpPost()>
Public Function Edit(...) As ActionResult
    ' Save updated ... information

    Me.TempData("UserMessage") = "Data Saved! You are truly an awesome user!"

    ' PRG back to Edit
    Return RedirectToAction("Edit")
End Function

然后在我的视图(剃刀布局)中,我有代码来查找集合中"UserMessage"密钥的存在TempData,如果它存在,我构建了一些JavaScript来为用户呈现类似于咆哮的通知:

/* This only exists when we have something to show */
$(function () {
    showNotification([the message from TempData]); 
});

然后,类似咆哮的消息要么随着时间消失,要么用户可以点击消息来消除它.

到目前为止一切顺利,一切都按预期工作.用户POST Edit,他们被RPG回来Edit,咆哮的" 数据保存!你真是一个真棒用户! "消息显示和解雇.

如果用户然后导航到另一个页面,然后点击浏览器的后退按钮,则浏览器会深入到其缓存中,导致浏览器执行相同的javascript,向用户显示相同的" 数据已保存!您真是一个非常棒的用户! "消息再次.这让用户感到困惑,认为通过单击后退按钮,他们只是做了一些导致又一次保存的事情(或者无论消息是什么).

我正在寻找一种方法,一旦通知显示一次,我可以以某种方式阻止通知显示备份 - 基本上使它成为"一次性拍摄"消息.我想到的是:

• 包括a Guid和每条消息,并使用localStorage存储显示的消息ID列表,并且只有当所请求的消息不存在于显示的消息列表中时,才显示它.
  • 我曾经想过以同样的方式使用Cookie,但是为了将来的请求不必要地将cookie重新发送到服务器,并且需要仔细考虑cookie的内容并且可能无论如何都需要消息,这让我感到沮丧. .
• 而不是从操作方法返回消息,而是返回Guid指向数据库中的消息.然后在页面加载时,AJAX返回服务器以获取该消息.获得消息后,将从数据库中删除该消息,通过不返回任何消息来处理对该相同消息的后续请求.
• 包括a Guid和每条消息,并在显示消息之前,AJAX返回服务器以查看消息是否已经显示.显示消息后,AJAX返回服务器以记录消息已显示.

这些对我来说似乎都是站不住脚的,但如果有人想争论支持其中一个,我可能会相信.

我尝试过的事情:

• 消息被删除后删除DOM元素的所有痕迹.
• 显示消息时,.data()在消息的DOM元素上设置jQuery 属性以指示消息已显示,然后在显示消息之前,请确保该.data()字段不存在.

这些不起作用,因为浏览器在之后发生这两个DOM更改的时间点缓存页面.

基本上,我需要一个机制,我的javascript可以检查它是否真的需要显示这个给定的消息,如果是,显示它,但然后标记消息如图所示,如果要求再次显示它,它没有.有什么建议？

Answer 1

您可以设置一个 cookie 来存储所显示消息的状态，并在尝试显示消息时检查 cookie 是否存在。如果 cookie 存在，则不存在，如果不存在，则存在。
与跟踪 GUID 相比，似乎逻辑非常简单:)

// pseudocode
FUNCTION ShowMessage(args)
    // if the cookie is here, don't show the message
    IF StatusCookieIsPresent THEN RETURN

    // if the cookie isn't here, this is the first time showing the message
    ShowStatusMessage()

    // we showed the message, so set the cookie to make sure we don't
    // do it twice
    SetStatusCookie()
END FUNCTION