首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >浏览器sessionStorage。在选项卡之间共享?

浏览器sessionStorage。在选项卡之间共享?
EN

Stack Overflow用户
提问于 2013-12-02 18:16:52
回答 4查看 204.5K关注 0票数 192

我在我的网站中有一些值,我想在浏览器关闭时清除它们。我选择了sessionStorage来存储这些值。当选项卡关闭时,如果用户按下f5,这些值确实会被清除并保留;但如果用户在不同的选项卡中打开某个链接,这些值将不可用。

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

用例:将一个值放入一些存储中,使该值在所有浏览器选项卡中都可访问,如果所有选项卡都已关闭,则将其清除。

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

回答 4

Stack Overflow用户

回答已采纳

发布于 2015-09-25 00:47:25

您可以使用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');
};

我在chrome,ff,safari,ie 11,ie 10,ie9中测试过

这个方法“应该可以在IE8中工作”,但我无法测试它,因为我的IE在每次打开选项卡时都会崩溃……任何标签...在任何网站上。(好的IE) PS:如果你也想要IE8支持,你显然需要包含一个JSON填充。:)

归功于这篇全文:http://blog.guya.net/2015/06/12/sharing-sessionstorage-between-tabs-for-secure-multi-tab-authentication/

票数 167
EN

Stack Overflow用户

发布于 2016-03-23 13:11:17

实际上,看看其他区域,如果你用_blank打开,它会一直保留sessionStorage,只要你在打开父标签的时候打开标签:

在这个链接中,有一个很好的jsfiddle来测试它。sessionStorage on new window isn't empty, when following a link with target="_blank"

票数 12
EN

Stack Overflow用户

发布于 2016-08-25 01:35:50

我的解决方案是创建一个localProfile并去掉这个变量,这样就不能让sessionStorage在标签上传输了。如果这个变量被设置了,但是我的sessionStorage变量没有被设置,那么就继续重新初始化它们。当用户注销窗口关闭时,请销毁此localStorage变量

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/20325763

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档