ホームページ >ウェブフロントエンド >jsチュートリアル >SessionStorage データをブラウザのタブ間で共有するにはどうすればよいですか?

SessionStorage データをブラウザのタブ間で共有するにはどうすればよいですか?

Patricia Arquette
Patricia Arquetteオリジナル
2024-10-21 15:06:03548ブラウズ

How to Share SessionStorage Data Across Browser Tabs?

ブラウザのタブ間で SessionStorage データを共有する

問題:

にデータを保存したいすべてのタブからアクセスできる Web サイトであり、ブラウザを閉じるときにクリアする必要があります。ただし、sessionStorage は現在のタブ内でのみ保持されます。

質問:

アプリケーション内のすべてのブラウザ タブ間で sessionStorage の値を共有するにはどうすればよいですか?

回答:

localStorage とその「ストレージ」eventListener を利用して、sessionStorage データをあるタブから別のタブに転送できます。これを実装するには:

  1. すべてのタブに次のコードを含めます:

    <code class="js">// transfers sessionStorage from one tab to another
    var sessionStorage_transfer = function(event) {
      // Handle sessionStorage data transfer between tabs
    };
    
    // listen for changes to localStorage
    if(window.addEventListener) {
      window.addEventListener("storage", sessionStorage_transfer, false);
    } else {
      window.attachEvent("onstorage", sessionStorage_transfer);
    };</code>
  2. トリガー イベント他のタブから sessionStorage データをリクエストするには:

    <code class="js">// Ask other tabs for session storage (this triggers the event)
    if (!sessionStorage.length) {
      localStorage.setItem('getSessionStorage', 'foobar');
      localStorage.removeItem('getSessionStorage', 'foobar');
    };</code>

このソリューションにより、同じブラウザ内のすべてのタブで sessionStorage データを共有できます。これは、複数のブラウザー タブ間でアクセスできる必要があるデータを維持する場合に便利な手法です。

以上がSessionStorage データをブラウザのタブ間で共有するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。