javascript - 跟踪发送给用户的实时通知的最佳方式是什么？

Question

我正在使用一个类似咆哮的 jQuery 插件，向用户发送实时消息以共享网站上的事件。现在，我仅向用户更新自用户上次访问网站以来发生的通知。但是，当我在网站上打开多个选项卡时，由于长轮询请求，只有某些选项卡会收到通知，因为选项卡可以在其他选项卡收到通知之前刷新通知。

实现每个选项卡同时显示消息的通知系统的最佳方法是什么？也许也是为了保持一定程度的持久性，例如，即使用户导航到不同的页面，通知也会在页面上保留 15 秒？

Answer 1

您可以使用window.localStorage对象作为选项卡/窗口之间共享的通知缓冲区。 为了确保跨浏览器兼容性，您还可以使用 store.js库而不是直接处理 localStorage。

因此，您可以通过网络套接字或任何其他方式将通知发送给客户端，处理程序会将它们推送到此缓冲区。 假设这将是一个像这样的数组

[
    notification1,
    notification2
    // etc.
]

当用户打开每个窗口(选项卡)时，应该在 localStorage 中注册它，例如:

{
    wnd_<timestamp_of_window1_onload_event>: 1
    wnd_<timestamp_of_window2_onload_event>: 1
}

在每个窗口(选项卡)中，您可以使用 window.setInterval 函数每 N 毫秒检查一次缓冲区是否有新通知。 setInterval 调用的函数将从缓冲区读取新通知并显示它们。 在 window.onbeforeunload 处理程序中，您将从 localStorage 中的 windows 集合中取消注册当前窗口。如果当前窗口注销后窗口集合变空，您可以清空通知缓冲区。 当然，这是一个简短的解决方案，也许您需要考虑在所有窗口关闭之前从缓冲区中删除已弃用的(由所有窗口处理的)通知。