如何存储浏览器会话在选项卡之间共享?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (46)

我在我的站点有一些值,我想清除浏览器关闭时,我选择sessionStorage来存储该值,它清除了标签关闭时,并保持存储,如果用户按f5,但如果用户打开不同标签中的某个链接,这个值不可用。我如何使用我的应用程序在所有浏览器选项卡之间共享sessionStorage值?

用例:将值放入某个存储中,在所有浏览器选项卡中保持该值可访问,并在所有选项卡关闭时将其清除。

if (!sessionStorage.getItem(key)) {
    sessionStorage.setItem(key, defaultValue)
}

任何人都可以查看我的问题吗?

提问于
用户回答回答于

可以使用localStorage及其“存储”EventListener将sessionStorage数据从一个选项卡传输到另一个选项卡。

这段代码需要存在于所有选项卡上。它应该在其他脚本之前执行。

// transfers sessionStorage from one tab to another
var sessionStorage_transfer = function(event) {
  if(!event) { event = window.event; } // ie suq
  if(!event.newValue) return;          // do nothing if no value to work with
  if (event.key == 'getSessionStorage') {
    // another tab asked for the sessionStorage -> send it
    localStorage.setItem('sessionStorage', JSON.stringify(sessionStorage));
    // the other tab should now have it, so we're done with it.
    localStorage.removeItem('sessionStorage'); // <- could do short timeout as well.
  } else if (event.key == 'sessionStorage' && !sessionStorage.length) {
    // another tab sent data <- get it
    var data = JSON.parse(event.newValue);
    for (var key in data) {
      sessionStorage.setItem(key, data[key]);
    }
  }
};

// listen for changes to localStorage
if(window.addEventListener) {
  window.addEventListener("storage", sessionStorage_transfer, false);
} else {
  window.attachEvent("onstorage", sessionStorage_transfer);
};


// Ask other tabs for session storage (this is ONLY to trigger event)
if (!sessionStorage.length) {
  localStorage.setItem('getSessionStorage', 'foobar');
  localStorage.removeItem('getSessionStorage', 'foobar');
};
用户回答回答于

使用sessionStorage是不能的。

MDN文档

在新选项卡或窗口中打开页面将导致启动新会话。

意味着你不能在选项卡之间共享,因为你应该使用localStorage

所属标签

可能回答问题的人

  • 嗨喽你好

    7 粉丝480 提问8 回答
  • uncle_light

    5 粉丝518 提问7 回答
  • Richel

    4 粉丝0 提问6 回答
  • 人生的旅途

    10 粉丝484 提问6 回答

扫码关注云+社区

领取腾讯云代金券