如何获取当前应用程序使用的总 html5 存储大小

Question

我需要一种方法来查找在运行时使用 HTML5 sessionStorage/localStorage 的应用程序占用的总大小。

我不想要基于分析器的方法。

我目前正在做的是 -

var data = 0;
for(var v in window.sessionStorage){
 data += window.sessionStorage.getItem(v); 
}

console.log(data);//.length to get char length

然后我将此值复制粘贴到文本文件中并检查大小。

丑陋，仍然对我没有帮助。 HTML5 API 中有没有内置的方法（任何方法）？

谢谢。

Answer 1

不，不能跨浏览器。 IE 有点像has it，其他的则没有。但当然，可以计算剩余域上的大小。请参阅以下示例。

仅适用于 IE：

var remSpace = window.localStorage.remainingSpace;

对于 FF/Chrome/Safari：

 var limit = 1024 * 1024 * 5; // 5 MB
 var remSpace = limit - unescape(encodeURIComponent(JSON.stringify(localStorage))).length;

歌剧： 5 MB 是标准的，但浏览器会增加限制，因为应用程序需要更多空间。

Answer 2

我在尝试找到自己的解决方案时发现了这个问题，并想分享我最终的结果，以防万一它可能对其他人有帮助。

简而言之，当我向 localStorage 添加一个值时，我将它的键放入一个数组中。然后，在向 localStorage 写入其他内容之前，我会遍历这些键并获取它们的长度总和，以确保我没有超过我可以接受的阈值。

如果 localStorage 大于 2Mb（在这种情况下），则它会从 localStorage 中删除第一项，从数组中删除该条目，然后写入新条目。

// check the size of localStorage

var localStorageArray = [];
var localStorageSize = 0;

for ( var i=0; i < localStorageArray.length; i++ ) {
    localStorageSize += localStorage.getItem(localStorageArray[i]).length;
}

// save to localStorage if it has not been saved already

if ( !localStorage.getItem(key) ){
    if ( localStorageSize < 2000000 ) {
        localStorage.setItem(key, value);
        localStorageArray.push(key);
    } else {
        localStorage.removeItem(localStorageArray[0]);
        localStorageArray.shift();
        localStorage.setItem(key, value);
        localStorageArray.push(key);
    }
}