HTML5提供了很多本地缓存的API,我个人用到的是localStorage和sessionStorage,这两个的用法也很简单,以key-value的形式,setItem("key",value) ,getItem('key')这是其中的写入和读取的方法,还有常用的clear(),remove()等,localStorage是没有过期策略,永久保存,除非手动删除,而sessionStorage老司机应该自然会想到session,对的,就是打开新的相同的页面或者关闭浏览器数据就过期,这两者存储的数据量要比cookie多。
好,正题,最近做Cordova的小demo,那天遇到一个需要在客户端缓存数据的问题,于是我首先想到的就是用H5的本地存储了,毕竟是运行在手机上的,基本上都支持。
我个人是比较追求完美主义的,所以怎么能够忍遇到一个页面就向后台请求一次数据,于是我就想的是第一次请求的时候,如果读取本地,没有信息,那么直接访问后台请求,如果有,直接从本地读取,好了,坑来了,我们在本地存储的数据肯定不会是一个字符串那么简单,于是,就扯到了前端序列化,有一个方法叫JSON.stringify(src),src是源对象,存进去之后,当然读取的时候就要反序列化了,eval("("+data+")");//转换为json对象
为什么要 eval这里要添加 “("("+data+")");//”呢?
原因在于:eval本身的问题。 由于json是以”{}”的方式来开始以及结束的,在JS中,它会被当成一个语句块来处理,所以必须强制性的将它转换成一种表达式。
然后就可以实现本地缓存数据了,一个小坑,稍微的耽搁了我一点儿时间。