神刀安全网

封装HTML5 localStorage 和sessionStorage,添加了超时时间,序列化方法。

WebStorageCache

封装HTML5 localStorage 和sessionStorage,添加了超时时间,序列化方法。 封装HTML5 localStorage 和sessionStorage,添加了超时时间,序列化方法。 封装HTML5 localStorage 和sessionStorage,添加了超时时间,序列化方法。 封装HTML5 localStorage 和sessionStorage,添加了超时时间,序列化方法。

WebStorageCache 对HTML5 localStorage 和sessionStorage 进行了扩展,添加了超时时间,序列化方法。可以直接存储json对象,同时可以非常简单的进行超时时间的设置。

优化WebStorageCache 自动清除访问的过期数据,避免了过期数据的累积。另外也提供了清除全部过期数据的方法: wsCache.deleteAllExpires();

Language

English

用法

下载 最新 WebStorageCache。

使用WebStorageCache,只要在页面上引入下面代码即可。

<script src="src/web-storage-cache.js"></script> <script> // create WebStorageCache instance. var wsCache = new WebStorageCache(); // cache 'wqteam' at 'username', expired in 100 seconds wsCache.set('username', 'wqteam', {exp : 100}); </script>

也可以在RequireJS使用WebStorageCache:

define(['web-storage-cache'], function(WebStorageCache) {     // 初始化 WebStorageCache 实例.     var wsCache = new WebStorageCache();     // 缓存字符串'wqteam' 到 'username' 中, 超时时间100秒.     wsCache.set('username', 'wqteam', {exp : 100}); });

例子

var wsCache = new WebStorageCache();  // 缓存字符串'wqteam' 到 'username' 中, 超时时间100秒 wsCache.set('username', 'wqteam', {exp : 100});  // 超时截止日期 2015 5 18 wsCache.set('username', 'wqteam', {exp : new Date('2015 5 18')});  // 获取缓存中 'username' 的值 wsCache.get('username');  // 缓存简单js对象,默认使用序列化方法为JSON.stringify。可以通过初始化wsCache的时候配置serializer.serialize wsCache.set('user', { name: 'Wu', organization: 'wqteam'});  // 读取缓存中的简单js对象 - 默认使用反序列化方法为JSON.parse。可以通过初始化wsCache的时候配置serializer.deserialize var user = wsCache.get('user'); alert(user.name + ' belongs to ' + user.organization);  // 删除缓存中 'username' wsCache.delete('username');  // 手工删除所有超时CacheItem, wsCache.deleteAllExpires();  // 清除客户端中所有缓存 wsCache.clear();  // 为已存在的(未超时的)缓存值设置新的超时时间。 wsCache.touch('username', 1);  // 如果缓存中没有key为username2的缓存,则添加username2。反之什么都不做 wsCache.add('username2', 'wqteam', {exp : 1});  // 如果缓存中有key为username的缓存,则替换为新值。反之什么都不做 wsCache.replace('username', 'new wqteam', {exp : 1});  // 检查当前选择作为缓存的storage是否被用户浏览器支持。 //如果不支持调用WebStorageCache API提供的方法将什么都不做。 wsCache.isSupported();

API

Constructor

var wsCache = new WebStorageCache({     // [可选] 'localStorage', 'sessionStorage', window.localStorage, window.sessionStorage     //        或者其他实现了 [Storage API] 的storage实例.     //        默认 'localStorage'.     storage: 'localStorage',     // [可选]  类型Number,公共超时事件设置。默认无限大     exp: Infinity });

isSupported

检查当前选择作为缓存的storage是否被用户浏览器支持。 如果不支持调用WebStorageCache API提供的方法将什么都不做。

wsCache.isSupported(); // 返回值Boolean。

set

往缓存中插入数据。

// key [必填] 必须要为String类型。 // value [必填] 支持所以可以JSON.parse 的类型。注:当为undefined的时候会执行 delete(key)操作。 // options [选填] js对象,包含两个属性 exp 和 force。 // { //     // 类型Number。超时时间,秒。默认无限大。 //     exp: 100, //     // 类型Boolean。为true时:当超过最大容量导致无法继续插入数据操作时,先清空缓存中已超时的 //     // 内容后再尝试插入数据操作。默认为true。 //     force: true // } wsCache.set(key, value, options);

get

根据key获取缓存中未超时数据。返回相应类型String、Boolean、PlainObject、Array的值。

// key [必填] String类型。如果发现该key对应的值已过期,会进行delete(key)操作,返回null。 wsCache.get(key);

delete

根据key删除缓存中的值。

wsCache.delete(key);

deleteAllExpires

删除缓存中所有通过WebStorageCache存储的超时值。

wsCache.deleteAllExpires();

clear

清空缓存中全部的值。注意:这个方法会清除不是使用WebStorageCache插入的值。推荐使用: deleteAllExpires

wsCache.clear();

touch

根据key为已存在的(未超时的)缓存值以当前时间为基准设置新的超时时间。

// key [必填] String类型 // exp [必填] number 单位:秒 js对象包含exp属性(以当前时间为起点的新的超时时间) wsCache.touch(key, exp: 1);

add

根据key做插入操作,如果key对应的值不存在或者已超时则插入该值,反之什么都不做。 注:不是通过WebStorageCache插入的值也会当作失效的值,依然执行 add 操作

wsCache.add(key, value, options);

replace

根据key做插入操作,如果key对应的值存在并且未超时则插入该值,反之什么都不做

注:超时时间以当前时间为基准重新设置。

wsCache.replace(key, value, options);

转载本站任何文章请注明:转载至神刀安全网,谢谢神刀安全网 » 封装HTML5 localStorage 和sessionStorage,添加了超时时间,序列化方法。

分享到:更多 ()

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址