多頁面共用sessionStorage的實現（轉載）
sessionStorage的局限:
sessionStorage是頁面級別的，僅在一個標籤頁生效，如果同一個瀏覽器同時打開多個標籤頁，且都訪問同一個域名，sessionStorage是不會在這多個標籤頁共用的，即每個標籤頁都有自己的sessionStorage。 如果想突破這種局限，實現多tab頁共享存取數據同時又有sessionStorage暫存性的功能（關閉頁面時存在裡面的數據也消失的功能），則需要自己通過一些技巧實現手動維護多tab頁面記憶體儲某個對象的數據，就是目前我想要講的方法。
方法：通過給localStorage存儲數據，可以在全瀏覽器內捕獲一個storage的事件，然後再拿到該事件傳過來的數據進行本地修改維護，多個tab頁就以此通訊，同步數據。
ES6實現：
const MemoryStorage = class {
constructor(){
this.data = {};
}
setItem(k, v){
this.data[k] = v;
MemoryStorage.dataSendHandler( this.data );
}
getItem(k){
return this.data[k];
}
removeItem(k){
delete this.data[k];
MemoryStorage.dataSendHandler( this.data );
}
clear(){
this.data = {};
MemoryStorage.dataSendHandler( this.data );
}
static dataSendHandler( data ){
localStorage.setItem('setMemoryStorage', JSON.stringify(data));
localStorage.removeItem('setMemoryStorage');
}
static dataGetHandler(){
localStorage.setItem('getMemoryStorage', new Date().getTime());
localStorage.removeItem('getMemoryStorage');
}
}
const initMemoryStorage = function(){
var memoryStorage = new MemoryStorage();
window.addEventListener('storage',function(e){
if( e.newValue===null ) return false;
if(e.key == 'getMemoryStorage'){
console.log('有其他頁面取memory')
MemoryStorage.dataSendHandler( memoryStorage.data );
}
else if(e.key == 'setMemoryStorage'){
let data = JSON.parse(e.newValue);
if( isEmptyObj(data) ){
console.log('memory被清空了')
memoryStorage.data = {};
}else{
console.log('memory被修改了')
for(let k in data){
memoryStorage.data[k] = data[k];
}
}
}
})
if( isEmptyObj(memoryStorage.data) ){
MemoryStorage.dataGetHandler();
}
}
function isEmptyObj(obj){
for(let i in obj){
return false;
}
return true;
}
export default initMemoryStorage;
以上內容原文地址（//blog.csdn.net/weixin_33716154/article/details/88797059）
