这是一个HTML5提供的本地存储方案,它会在本地存储一个key,value的对象。
如果需要使用localStorage存储数据的话,主要为每个值添加唯一的标识。不然很容易读取到其他程序存储的内容。
PC端,这两个API在低版本的IE下是没有,所以是需要用try..catch包裹的.
在移动端,我刚刚开始是不加的,所测试的手机也没问题.但是现在很多浏览器有无痕模式,这个模式下,localStorage相关的API时禁用的.所以使用时,还是要保证代码的健壮性, 添加一个polyfill.
// 解决隐私模式下 localStorage 不正常问题
;(function() {
var KEY = '_localStorage_'
, VALUE = 'test';
// 检测是否正常
try {
localStorage.setItem(KEY, VALUE);
} catch(e) {
var noop = function() {};
localStorage.__proto__ = {
setItem: noop,
getItem: noop,
removeItem: noop,
clear: noop
};
}
// 删除测试数据
if(localStorage.getItem(KEY) === VALUE) localStorage.removeItem(KEY);
})();
上面的这段代码,有一个严重的隐患,就是在原型的__proto__
属性上添加东西,这一点不是所有浏览器都支持的,所以我在ios7下会得到报错。
解决方案:建议使用其他命名替代localstorage
或者针对localstorage
部分使用try,catch包装。