Heim  >  Artikel  >  Web-Frontend  >  Wie teile ich SessionStorage-Werte zwischen Browser-Registerkarten?

Wie teile ich SessionStorage-Werte zwischen Browser-Registerkarten?

Barbara Streisand
Barbara StreisandOriginal
2024-10-21 15:25:30962Durchsuche

How to Share SessionStorage Values Between Browser Tabs?

SessionStorage-Werte zwischen Browser-Tabs teilen

Der Sitzungsspeicher speichert Daten, auf die innerhalb eines einzelnen Browser-Tabs zugegriffen werden kann, und wird gelöscht, wenn der Tab geschlossen wird. Für bestimmte Anwendungen besteht jedoch die Notwendigkeit, Sitzungsspeicherwerte zwischen Registerkarten zu teilen.

Um dies zu erreichen, können Sie localStorage und seinen „Storage“-Ereignis-Listener verwenden. Unten ist ein Codeausschnitt, der die Übertragung von SessionStorage über mehrere Registerkarten hinweg ermöglicht:

<code class="javascript">// 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' &amp;&amp; !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');
};</code>

Dieser Code sollte auf allen Registerkarten ausgeführt werden und vor anderen Skripten ausgeführt werden.

Diese Methode ermöglicht die Übertragung von SessionStorage-Werten über mehrere Registerkarten hinweg Registerkarten in Chrome, Firefox, Safari, IE 11, IE 10 und IE9. In IE8 müssen Sie aus Kompatibilitätsgründen einen JSON-Shim einschließen.

Durch die Implementierung dieses Codes können Sie sessionStorage-Werte effektiv zwischen Registerkarten teilen, sodass Ihre Anwendungen Daten dauerhaft über mehrere Registerkarten hinweg innerhalb derselben Browsersitzung speichern können .

Das obige ist der detaillierte Inhalt vonWie teile ich SessionStorage-Werte zwischen Browser-Registerkarten?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn