브라우저 탭 간에 SessionStorage 값을 공유하는 방법은 무엇입니까?

브라우저 탭 간 sessionStorage 값 공유

세션 스토리지는 단일 브라우저 탭 내에서 액세스할 수 있는 데이터를 저장하고 탭을 닫으면 지워집니다. 그러나 특정 애플리케이션의 탭 간에 세션 저장 값을 공유해야 할 필요가 있습니다.

이를 달성하려면 localStorage와 해당 "저장" 이벤트 리스너를 활용할 수 있습니다. 다음은 탭 간에 sessionStorage 전송을 활성화하는 코드 조각입니다.

<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>

이 코드는 모든 탭에서 실행되어야 하며 다른 스크립트보다 먼저 실행되어야 합니다.

이 방법을 사용하면 sessionStorage 값을 탭 간에 전송할 수 있습니다. Chrome, Firefox, Safari, IE 11, IE 10 및 IE9의 탭. IE8에서는 호환성을 위해 JSON shim을 포함해야 합니다.

이 코드를 구현하면 탭 간에 sessionStorage 값을 효과적으로 공유할 수 있으므로 애플리케이션이 동일한 브라우저 세션 내의 여러 탭에 걸쳐 지속적으로 데이터를 저장할 수 있습니다. .

위 내용은 브라우저 탭 간에 SessionStorage 값을 공유하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!