[解決済み] ブラウザのsessionStorage。タブ間で共有？

質問

私のサイトには、ブラウザを閉じたときに消去したい値があります。私は sessionStorage を使用して、これらの値を保存します。タブが閉じられると、それらは確かにクリアされ、ユーザーがf5を押すと保持されます。しかし、ユーザーが別のタブで何らかのリンクを開くと、これらの値は使用できなくなります。

どのようにすれば sessionStorage の値は、私のアプリケーションですべてのブラウザタブ間で使用できますか？

使用例：あるストレージに値を置き、その値をすべてのブラウザタブでアクセス可能にしておき、すべてのタブを閉じたらその値を消去する。

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

解決方法は？

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');
};

クローム、FF、サファリ、IE11、IE10、IE9でテストしました。

この方法はIE8で動作するはずですが、私のIEはタブを開くたびに...どんなタブでも...どんなウェブサイトでもクラッシュしてしまうので、テストすることができませんでした。(古き良きIE) PS: IE8をサポートしたい場合は、明らかにJSON shimを含める必要があります。）

クレジットはこちらの記事全文をご覧ください。 http://blog.guya.net/2015/06/12/sharing-sessionstorage-between-tabs-for-secure-multi-tab-authentication/