如何跨浏览器选项卡共享 SessionStorage 数据？

跨浏览器选项卡共享 SessionStorage 数据

问题：

您想要将数据存储在您的网站可以从所有选项卡访问，并且应该在浏览器关闭时清除。但是，sessionStorage 仅在当前选项卡中保留。

问题：

如何在应用程序内的所有浏览器选项卡之间共享 sessionStorage 值？

答案：

您可以利用 localStorage 及其“存储”事件监听器将 sessionStorage 数据从一个选项卡传输到另一个选项卡。要实现此操作：

1. 在所有选项卡上包含以下代码：

   <code class="js">// transfers sessionStorage from one tab to another
   var sessionStorage_transfer = function(event) {
     // Handle sessionStorage data transfer between tabs
   };
   
   // listen for changes to localStorage
   if(window.addEventListener) {
     window.addEventListener("storage", sessionStorage_transfer, false);
   } else {
     window.attachEvent("onstorage", sessionStorage_transfer);
   };</code>

2. 触发事件从其他选项卡请求 sessionStorage 数据：

   <code class="js">// Ask other tabs for session storage (this triggers the event)
   if (!sessionStorage.length) {
     localStorage.setItem('getSessionStorage', 'foobar');
     localStorage.removeItem('getSessionStorage', 'foobar');
   };</code>

此解决方案允许您在同一浏览器中的所有选项卡之间共享 sessionStorage 数据。对于维护需要跨多个浏览器选项卡访问的数据来说，这是一种有用的技术。

以上是如何跨浏览器选项卡共享 SessionStorage 数据？的详细内容。更多信息请关注PHP中文网其他相关文章！