存储浏览器选项卡特定数据

Question

我有一个Web应用程序,存储有关最近访问过的页面的信息,让我们称之为A.当用户访问另一个页面类型,称为B时,我在顶部呈现一个菜单,其中有一个按钮,指向最近访问过的A页面.可以通过A页面或B页面访问B页面,并且用户可以将其视为A的属性.

这很好但是当有人打开两个标签并且在标签1中的B页面上有一个指向A页面A1的链接时,它们会打开一个新标签并访问A页面A2.当用户然后刷新选项卡1中的B页时,菜单变为A2.我希望能够识别正在使用的选项卡,以便我可以为选项卡1保存A1,以便它不会更改为A2.

使用一个标签时:

A1 -> B1 -> B2 (the menu points back to A1)

使用两个标签时:

Time            | T1       | T2       | T3          
----------------+----------+----------+-------------
Tab 1:          | A1 -> B1 |          | [refresh B1]
Tab 2:          |          | A2 -> B3 |             
----------------+----------+----------+-------------
Menu points to: | A1    A1 | A2    A2 | A2

当用户返回选项卡1时,这会使用户在选项卡2(A2)中而不是A1中查看用户.

我担心无法获取浏览器标签ID,但有人可能有任何解决方法的想法？

Answer 1

HTML5 sessionStorage解决了这个问题:

站点可以将数据添加到会话存储,并且可以从该窗口中打开的同一站点的任何页面访问它.

它受到所有现代浏览器的支持

另一种方法是使用window.name财产.它是特定于选项卡/窗口的,并且在浏览器导航时保持不变.因此,您可以在您的window.name财产中存储一些tab id

Answer 2

编辑：时间的流逝使我 2012 年的原始答案不正确。正如 Bedrin 指出的那样，您现在可以使用Window.sessionStorage对象：

sessionStorage 属性允许您访问当前源的会话存储对象。sessionStorage 与 Window.localStorage 类似，唯一的区别是 localStorage 中存储的数据没有过期设置， sessionStorage 中存储的数据在页面会话结束时被清除。只要浏览器打开，页面会话就会持续，并在页面重新加载和恢复后继续存在。在新选项卡或窗口中打开页面将导致启动新会话，这与会话 cookie 的工作方式不同。

原始答案（2012）：

恐怕这不可能以可移植的方式实现，因为您发现自己无法检索诸如浏览器选项卡 ID 之类的内容。据我所知，HTML 标准完全不知道浏览器中的选项卡。

我能想到的唯一解决方法是：在您的应用程序中实施和管理选项卡。我见过几个这样做的商业 Web 应用程序，但是（恕我直言）用户体验非常糟糕。