基于'sessionStorage'与'userData'的类session存储
生活随笔
收集整理的這篇文章主要介紹了
基于'sessionStorage'与'userData'的类session存储
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
Storage.js:
?注意:此版本實現(xiàn)的存儲在符合Web存儲標(biāo)準(zhǔn)(ie8及ie8以上的版本與其他主流瀏覽器)的情況下與session的周期一致,但在頁面不關(guān)閉的情況下沒有過期時間,ie7及以下版本則默認(rèn)是永久保存,但可以通過預(yù)留的方法setMaxAge(Number age)來設(shè)置有效期,設(shè)置0的話在關(guān)閉或刷新頁面時會清除緩存。
(function initStorageClass(win){var inherit=function(o){if(o===null || o ===undefined) throw TypeError();if(Object.create) return Object.create(o);var t = typeof o;if(t!=='object'&&t!=='function') throw TypeError();function f(){}f.prototype=o;return new f();};var extend=function(a,b){for ( var key in b) { a[key]=b[key]; }return a;};var defineSubclass=function(superclass,constructor,methods,statics){constructor.prototype=inherit(superclass.prototype);constructor.prototype.constructor=constructor;if(methods) extend(constructor.prototype,methods);if(statics) extend(constructor,statics);return constructor;};Function.prototype.extend=function(constructor,methods,statics){return defineSubclass(this,constructor,methods,statics);};// 創(chuàng)建一個抽象類var AbstractStorage=function AbstractStorage(){throw new Error('Can\'t create abstract class instance');};// 添加抽象類的實例方法(已實現(xiàn)) extend(AbstractStorage.prototype,{setItem:function(k,v){k=encodeURIComponent(k);v=encodeURIComponent(v);this.storage.setItem(k,v);return this;},getItem:function(k){k=encodeURIComponent(k);return decodeURIComponent(this.storage.getItem(k));},removeItem:function(k){k=encodeURIComponent(k);this.storage.removeItem(k);return this;},setMaxAge:function(age){ // 為IE的userData版本預(yù)留了設(shè)置有效期的方法if(isNaN(age)) throw new TypeError('userData\' max-age must be a number,but '+age+' is not a number');if(this.model&&this.model==='userData') {var now=new Date().getTime();var expires=now+age*1000;this.storage.expires=new Date(expires).toUTCString();} else {throw new Error('sessionStorage did\'t support set max-age。');}return this;}});var Storage=null;if(win.Storage) {// 實現(xiàn)了Web存儲標(biāo)準(zhǔn)的瀏覽器Storage=AbstractStorage.extend(function WebStorage(){// IE中實現(xiàn)了Web存儲標(biāo)準(zhǔn)的版本,在本地目錄下無法使用sessonStorageif(!win.sessionStorage) {throw new Error('local web is can\'t save sessionStorage');}this.model='sessionStorage';// 默認(rèn)使用sessionStorage,也可以自己傳入,model自行修改this.storage=win.sessionStorage;});} else if(win.navigator.appVersion&&win.navigator.appVersion.indexOf('MSIE')>=0){// 不支持web存儲標(biāo)準(zhǔn)的IE瀏覽器(IE11的核心版本已和Netscape統(tǒng)一,IE8以上的支持web存儲標(biāo)準(zhǔn))Storage=(AbstractStorage.extend(function IEStorage(maxAge){this.model='userData';this.maxAge=maxAge;this.storage=(function initUserData(t){var memory = document.createElement('div');memory.style.display='none';//附加userData行為memory.style.behavior='url("#default#userData")';document.appendChild(memory);if(t.maxAge) {// 設(shè)置userData有效期,默認(rèn)永久,單位毫秒var now=new Date().getTime();var expires=now+t.maxAge*1000;memory.expires=new Date(expires).toUTCString();}memory.load('UserDataStorage'); //載入存儲的 extend(memory,{setItem:function(k,v){this.setAttribute(k,v);this.save('UserDataStorage');return this;},getItem:function(k){return this.getAttribute(k)||null;},removeItem:function(k){this.removeAttribute(k);this.save('UserDataStorage');return this;}});return memory;}(this));}));}win.IStorage=Storage;win.memory=new Storage()||null;// 創(chuàng)建一個實例對象,可以在腳本中直接引用 }(window));?
index.html(簡單測試):
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script type="text/javascript" src="Storage.js"></script> <script type="text/javascript">window.onload=function(){memory.setItem('test','success');alert(memory.getItem('test'));}; </script> </head> <body></body> </html>?
在HTML頁面中引用Storage.js文件,可以在宿主環(huán)境中直接使用已經(jīng)生成的實例memory(window.memory)。也可以自己創(chuàng)建一個新實例new IStorage()
memory.setItem('test','success'); // add alert(memory.getItem('test')); // select memory.removeItem('test'); // delete?
適用實現(xiàn)了Web存儲標(biāo)準(zhǔn)的瀏覽器(Storage)與IE瀏覽器(userData),userData的生命周期請自行根據(jù)項目進(jìn)行設(shè)置。
轉(zhuǎn)載于:https://www.cnblogs.com/gabin/p/3723892.html
總結(jié)
以上是生活随笔為你收集整理的基于'sessionStorage'与'userData'的类session存储的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: boost常用记录
- 下一篇: Dom4J 解析xml ,类查询