得知浏览器存储方式主要分为Cookie,IndexedDB,Web SQL,Session Storage,Local Storage.(除了Cookie,其他是HTML5新特性)这些存储方式对应文件保存在本地(eg:chrome浏览器在地址栏搜索chrom://version 就有显示这些文件所在的文件夹),这些文件大都是sqlite数据库文件,可以用sqlite manager打开查看(看到有access数据库文件,电脑没安装access打不开,不过有的数据库文件是加密了),所以在chrome浏览器,他们使用数据库形式存储的。
由于IndexedDB,Web SQL规范问题会导致诸多兼容问题,所以想着没采用这两个。由于Cookie能存储的空间小,只剩下考虑Local Storage了。
同样,提供了相应的增删改查API,不过要看看,他的存储空间,不同浏览器可能会不通,测试代码如下;
(function () {
if(!window.localStorage){
console.log('当前浏览器不支持localStorage');
return;
}
var test='1234567890';
var cal=test;
while(true){
if(cal.length>=10240){
test=cal;
break;
}
cal+=test;
}
var sum=test;
while(true){
try{
window.localStorage.setItem('test',sum);
console.log('test length='+window.localStorage.getItem('test').length/1024+"KB");
sum+=test;
}catch (e){
var size=0;//原来的+现在的
for(item in window.localStorage){
if(window.localStorage.hasOwnProperty(item)){
size+=window.localStorage.getItem(item).length;
}
}
console.log('localStorage max length='+size/1024+'KB');
break;
}
}
})();
chrome浏览器为5MB