浏览器会话存储.在选项卡之间共享

您可以使用localStorage及其"storage"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，ie 9 中测试了这个

这种方法"应该在IE8中有效"，但我无法测试它，因为每次我在任何网站上打开一个选项卡……任何选项卡…时，我的IE都会崩溃。（好的ol IE）附言：如果你也想支持IE8，你显然需要包括一个JSON填充程序。：）

这篇完整的文章值得称赞：http://blog.guya.net/2015/06/12/sharing-sessionstorage-between-tabs-for-secure-multi-tab-authentication/

使用sessionStorage是不可能的。

从MDN文档

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

这意味着您不能在选项卡之间共享，为此您应该使用localStorage

实际上，看看其他区域，如果你用_blank打开，它会在打开父选项卡时保持会话存储：

在这个链接中，有一个很好的jsfiddle来测试它。sessionStorage on new window is'；t为空时_空白"；

1. 您可以使用localStorage并记住它在session cookie中首次创建的日期。当CCD_；会话"；比cookie的值旧，则可以清除localStorage

   缺点是，在浏览器关闭后，有人仍然可以读取数据，所以如果你的数据是私人的和保密的，这不是一个好的解决方案。

2. 您可以将数据存储到localStorage中几秒钟，并为storage事件添加事件侦听器。这样，您就可以知道任何选项卡何时向localStorage写入了内容，并且您可以将其内容复制到sessionStorage，然后只需清除localStorage

我发现在选项卡之间共享会话存储的唯一方法是window.open:

• window.open('./page2.html','')用新选项卡打开第2页
• window.open('./page2.html','height=100, width=100')在新窗口中使用新选项卡打开第2页

Page2可以从page1获取sessionStorage的副本，但这两个sessionStorage对象是相互独立的。

如果您有少量数据，您可以使用sessionStorage，而不是session cookie，它在用户关闭浏览器或清除cookie之前一直处于活动状态。它还可以在多个选项卡之间保留其值。

设置cookie 的代码

document.cookie = "cookiename=value; path=/";

通过省略CCD_ 19，我们设置了一个CCD_。

你这样检索它：

function getCookie(name) {
  var match = document.cookie.match(new RegExp('(^| )' + name + '=([^;]+)'));
  if (match) return match[2];
}
var value = getCookie('cookiename');

我不让sessionStorage通过选项卡转移的解决方案是创建一个localProfile并关闭这个变量。如果设置了此变量，但我的sessionStorage变量没有继续并重新初始化它们。当用户注销窗口关闭时，销毁此本地存储变量

这里有一个解决方案，可以防止java应用程序浏览器选项卡之间的会话剪切。这将适用于IE（JSP/Servlet）

1. 在您的第一个JSP页面中，onload事件调用servlet（ajex调用）以在会话中设置"window.title"和事件跟踪器（只是第一次设置为0的整数变量）
2. 确保其他页面都没有设置窗口。title
3. 页面加载完成后，所有页面（包括第一个页面）都会添加一个java脚本来检查窗口标题。如果找不到标题，请关闭当前页面/选项卡（发生这种情况时，请确保撤消"window.unload"功能）
4. 设置page window.onunload java脚本事件（对于所有页面）以捕获页面刷新事件，如果页面已经刷新，则调用servlet重置事件跟踪器

1） 第一页JS

BODY onload="javascript:initPageLoad()"
function initPageLoad() {
    var xmlhttp;
    if (window.XMLHttpRequest) {
        // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    } else {
        // code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {                           var serverResponse = xmlhttp.responseText;
            top.document.title=serverResponse;
        }
    };
                xmlhttp.open("GET", 'data.do', true);
    xmlhttp.send();
}

2） 所有页面的通用JS

window.onunload = function() {
    var xmlhttp;
    if (window.XMLHttpRequest) {
        // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    } else {
        // code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {             
            var serverResponse = xmlhttp.responseText;              
        }
    };
    xmlhttp.open("GET", 'data.do?reset=true', true);
    xmlhttp.send();
}
var readyStateCheckInterval = setInterval(function() {
if (document.readyState === "complete") {
    init();
    clearInterval(readyStateCheckInterval);
}}, 10);
function init(){ 
  if(document.title==""){   
  window.onunload=function() {};
  window.open('', '_self', ''); window.close();
  }
 }

3） web.xml-servlet映射

<servlet-mapping>
<servlet-name>myAction</servlet-name>
<url-pattern>/data.do</url-pattern>     
</servlet-mapping>  
<servlet>
<servlet-name>myAction</servlet-name>
<servlet-class>xx.xxx.MyAction</servlet-class>
</servlet>

4） servlet代码

public class MyAction extends HttpServlet {
 public void doGet(HttpServletRequest request, HttpServletResponse response)
        throws IOException {
    Integer sessionCount = (Integer) request.getSession().getAttribute(
            "sessionCount");
    PrintWriter out = response.getWriter();
    Boolean reset = Boolean.valueOf(request.getParameter("reset"));
    if (reset)
        sessionCount = new Integer(0);
    else {
        if (sessionCount == null || sessionCount == 0) {
            out.println("hello Title");
            sessionCount = new Integer(0);
        }
                          sessionCount++;
    }
    request.getSession().setAttribute("sessionCount", sessionCount);
    // Set standard HTTP/1.1 no-cache headers.
    response.setHeader("Cache-Control", "private, no-store, no-cache, must-                      revalidate");
    // Set standard HTTP/1.0 no-cache header.
    response.setHeader("Pragma", "no-cache");
} 
  }