跨浏览器的本地持久化存储解决方案
HTML5中引入localStorage这个特性,提供本地化存储数据的解决方案。其实IE早在6.0已经支持本地化存储,即UserData,只不过鲜为人知。UserData和localStorage接口并不通用,即使使用HTML5标准的localStorage,如果不对它进行二次封装,使用起来也十分不便,而且还有些问题,如key加密与冲突的问题,数据过期时间设置的问题等。
下面提供一个跨浏览器的数据本地存储封装,使开发者可以通过统一的接口存取本地化存储的数据而不必关心浏览器,并在一定程度上解决了UserData和localStorage原生接口的先天不足。
提供的对象localStore,该对象提供如下几个方法:
- set(String key, Mixed val [,Number expireAfterDays])功能:保存数据说明:expireAfterDays默认为7,即7天后数据自动失效返回:Mixed 存储后的数据
- get(String key)功能:读取数据返回:Mixed 存储后的数据
- del(String key)功能:删除数据返回:Boolean 删除成功或失败
这个封装的内部key是采用域名+端口+真正的key,MD5后生成的,保证了不与其他域的数据冲突,并且相当于加密了Key,在一定程度上保证了数据的安全性。(注意,绝对不要本地存储网站的敏感数据)
另外就是数据的过期时间是由localStore对象负责维护的,没有使用原生接口的数据过期机制。
效果如下:
提示:
(1)刷新浏览器查看本地化存储效果。
(2)键值可以接受任何JS对象,且是无污染的,即存入数字返回的还是数字。
没有评论:
发表评论