同步更新多个标签的sessionStorage

Question

如果我使用window.open或_blank从页面A打开新的标签B。 A和B的起源相同。

问题1：当我设置或清除页面B上的sessionStorage时，如何同步更新页面A的sessionStorage？

Q2：如果我使用localStorage共享数据，在关闭所有选项卡后如何清除这些数据？

Answer 1

一种简单的方法可以

  

维护localStorage中的选项卡数，并在关闭选项卡时检查它是否是最后一个，如果是，则从localStorage中删除sessionStorage

Answer 2

Q1：会话存储由选项卡分隔，因此无法对页面A到页面B的sessionStorage进行操作。但是您可以使用localStorage作为链接来控制每个选项卡和窗口，只需巧妙地使用附加到存储设备的事件监听器即可。

window.addEventListener('storage', function(e) {  
  console.log(e + ' updated on localStorage');
  // Code to modify sessionStorage here
});

第二季度：，您需要跟踪打开了多少个标签页，因为这相对容易，可能会导致错误（一次性关闭所有标签页不会触发清除操作），您需要为关闭事件附加事件监听器。

window.addEventListener('unload', function(e) {  
  console.log(e);
  // Code to clear the storage
});