https://github.com/WQTeam/web-storage-cache

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

<script src="src/web-storage-cache.js"></script>
<script src="~/scripts/AjaxCache/ajax-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>

例子:

ar wsCache = new WebStorageCache();

// 缓存字符串'wqteam' 到 'username' 中, 超时时间100秒
wsCache.set('username', 'wqteam', {exp : 100}); // 超时截止日期,可用使用Date类型
var nextYear = new Date();
nextYear.setFullYear(nextYear.getFullYear() + 1);
wsCache.set('username', 'wqteam', {exp : nextYear}); // 获取缓存中 '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();

  

web-storage-cache 使用JS数据缓存的更多相关文章

  1. Cache 应用程序数据缓存

    System.Web.Caching 命名空间提供用于缓存服务器上常用数据的类.此命名空间包括 Cache 类,该类是一个字典,您可以在其中存储任意数据对象,如哈希表和数据集.它还为这些对象提供了失效 ...

  2. 第十七课:js数据缓存系统的原理

    这一章主要讲的是jQuery的缓存系统的历史发展,以及他自己的框架的缓存系统的实现.都是源码解析. 我就挑几个重点讲下: (1)jQuery的缓存机制的原理 jQuery的缓存机制实现的原理是在元素中 ...

  3. System.Web.Caching.Cache类 Asp.Net缓存 各种缓存依赖

    Cache类,是一个用于缓存常用信息的类.HttpRuntime.Cache以及HttpContext.Current.Cache都是该类的实例. 一.属性 属性 说明 Count 获取存储在缓存中的 ...

  4. Web Storage:浏览器端数据储存机制

    目录 概述 操作方法 存入/读取数据 清除数据 遍历操作 storage事件 参考链接 概述 这个API的作用是,使得网页可以在浏览器端储存数据.它分成两类:sessionStorage和localS ...

  5. HTML 5 Web Storage 使用

    在html中,可以使用 Web Storage API 来保存数据在浏览器客户端,这样可以避免重复从服务器加载数据. 有两种API, sessionStorage 和 localStorage ,它们 ...

  6. HTML5分析实战Web存储机制(Web Storage)

    Web Storage它是Key-Value在持久性数据存储的形式.Web Storage为了克服cookie把所引起的一些限制.当数据需要严格格控制client准时,没有必要不断地发回数据serve ...

  7. 左手Cookie“小甜饼”,右手Web Storage

    目录 1. Web Storage 2. Cookie机制 3. 二者的联系与区别 1.Web Storage 1.1 概述 Web Storage是HTML5提供的一种新的浏览器端数据储存机制,它提 ...

  8. 浏览器 Web Storage - sessionStorage & localStorage

    storage事件 当储存的数据发生变化时,会触发storage事件.我们可以指定这个事件的回调函数. window.addEventListener("storage",onSt ...

  9. HTML5权威指南--Web Storage,本地数据库,本地缓存API,Web Sockets API,Geolocation API(简要学习笔记二)

    1.Web Storage HTML5除了Canvas元素之外,还有一个非常重要的功能那就是客户端本地保存数据的Web Storage功能. 以前都是用cookies保存用户名等简单信息.   但是c ...

随机推荐

  1. mysql 设置skip_name_resolve参数 日志 [Warning] 'user' entry 'root@localhost' ignored in --skip-name-resolve mode

    [环境介绍]  系统环境:Red Hat Enterprise Linux 7 + 5.7.25-enterprise-commercial-advanced-log MySQL Enterprise ...

  2. VS2017添加引用报错

    未能正确加载“ReferenceManagerPackage”包. 此问题可能是因配置更改或安装另一个扩展导致的.可通过查看文件“C:\Users\Administrator\AppData\Roam ...

  3. react native 安卓home返回键页面刷新

    import { withNavigationFocus } from 'react-navigation'; class Warngreete extends React.Component { c ...

  4. 新装的SSMS一打开就显示VS许可证过期,但VS又运行正常,解决方法。

    1.出现问题如下图: 2.解决方法 打开控制面板->程序卸载->找到Microsoft Visual Studio *** Shell(****),右击-修复. 3.修复好了,然后重启电脑 ...

  5. 小E浅谈丨区块链治理真的是一个设计问题吗?

    在2018年6月28日Zcon0论坛上,“区块链治理”这个话题掀起了大神们对未来区块链治理和区块链发展的一系列的畅想. (从左至右,分别为:Valkenburgh,Zooko,Jill, Vitali ...

  6. npm 如何安装npm包

    1.每个插件或者组件都会在官方网站有教程. 以https://v4.bootcss.com 为例 2.vuetify的 3.moment 的库

  7. The Ethereum devp2p and discv4 protocol Part II

    描述 本文章主上下两篇 上篇:讲述以太坊devp2p与disc4节点发现协议 下篇:实践篇,实现如何获取以太坊所有节点信息(ip,port,nodeId,client) 正文 本片为下篇:实践篇,主要 ...

  8. <A>标记onclick事件

    <script> function ss() { document.getElementById("btnPublicity").click(); }</scri ...

  9. Mac 装Sequel pro 连接 Mysql 8.0 失败、登录不了、loading问题

    最近都没更新博客,零零散散的笔记也都没整理,so 觉得还是不放上来了. 高兴的是入手了期待好久的水果机,开始了各种捣鼓,好想大撸一下代码啊.... 回到正轨,刚装了mysql8.0, 想装下mysql ...

  10. cURL error 60: SSL certificate problem: unable to get local issuer

    github 问题连接 https://github.com/yabacon/paystack-php/wiki/cURL-error-60:-SSL-certificate-problem:-una ...