Javascript本地儲存

sessionstorage 、localstorage 和 cookie

共同點：

都是儲存在瀏覽器端，且同源的。

區別：

cookie資料始終在同源的http請求中攜帶（即使不需要），即cookie在瀏覽器和伺服器間來回傳遞。而sessionstorage和localstorage不會自動把資料發給伺服器，僅在本地儲存。cookie資料還有路徑（path）的概念，可以限制cookie只屬於某個路徑下。

儲存大小限制也不同，cookie資料不能超過4k，同時因為每次http請求都會攜帶cookie，所以cookie只適合儲存很小的資料，如會話標識。sessionstorage和localstorage 雖然也有儲存大小的限制，但比cookie大得多，可以達到5m或更大。

資料有效期不同，sessionstorage：僅在當前瀏覽器視窗關閉前有效，自然也就不可能持久保持；localstorage：始終有效，視窗或瀏覽器關閉也一直儲存，因此用作持久資料；cookie只在設定的cookie過期時間之前一直有效，即使視窗或瀏覽器關閉。

作用域不同，sessionstorage不在不同的瀏覽器視窗中共享，即使是同乙個頁面；localstorage 在所有同源視窗中都是共享的；cookie也是在所有同源視窗中都是共享的。

web storage 支援事件通知機制，可以將資料更新的通知傳送給監聽者。

web storage 的 api 介面使用更方便。

define(function (require) ;
function support() 
$.extend(cache, ,
localstorage: window.localstorage,
memqueue: (function () ,
objs: 
};} else ;
}})(),
if (true == support()) 
}isfresh = false;}}
//如果isfresh為假，就是已過期，則返回null，否則從localstorage中取
return (false == isfresh) ? null : this.localstorage[key];}},
if (true == support()) 
//開始設定一下這個值
//為了相容性，用以下方法設定
if (typeof this.memqueue.objs != 'undefined' &&
this.memqueue.objs.length <= this.config.size)  else }}
}}
this.localstorage[key] = value;
//當前的key，也必須lru一下
this.lru(key);
//lru結束
this.localstorage.setitem('lruconfig', json.stringify(this.memqueue));}},
/**  近期最少使用演算法
*/lru: function(key) 
}// 如果
if(false == isin);
this.memqueue.keys[key] = _to;
this.memqueue.objs.push(_to);
}_o.sort(function(f, s)  else if (f.times > s.times)  else  else 
}});
} else ;
var _to = ;
this.memqueue.keys[key] = _to;
this.memqueue.objs.push(_to);
return null;}},
/**  讀取需要淘汰的一項
*/getlru: function() 
return null;
}});
return ;
});

var cache = require('cache');
// set 值
cache.cache.set('ip', '你自己的乙個url', value);
// get值
cache.cache.get('ip')

Javascript本地儲存

JavaScript本地儲存

Javascript本地儲存資料方案

Web 本地儲存和Vue本地儲存例項

Javascript本地儲存

JavaScript本地儲存

Javascript本地儲存資料方案

Web 本地儲存和Vue本地儲存例項

相關推薦