如何快速将JavaScript localStorage填充到其最大容量？

Question

我有一个经常使用localStorage的应用程序。有时我达到localStorage最大容量，我捕获异常并清理一些旧数据。

try {
   localStorage.setItem(myKey, myData);
}catch(error){
   // empty some old data in localStorage and re-insert myKey and myData
}

除了我无法轻易测试外，一切都很好。我正在寻找一种方法来快速填充我的localStorage最大容量，以便我可以在不同的条件和浏览器中测试代码。

Answer 1

大多数浏览器都有5mb - 10mb localStorage，例如，chrome有5mb。 使用for循环测试localStorage的限制，并在超过限制时捕获。

然后输出结果。

试试这个：

  

https://jsfiddle.net/dalinhuang/6aeb3fcr/

if (localStorage && !localStorage.getItem('size')) {
    var i = 0;
    try {
        // Test up to 10 MB
        for (i = 250; i <= 10000; i += 250) {
            localStorage.setItem('test', new Array((i * 1024) + 1).join('a'));
        }
    } catch (e) {
        localStorage.removeItem('test');
        localStorage.setItem('size', i - 250);            
    }
}

console.log('max localStorage size: ' + localStorage.getItem('size') + 'kb');

  

参考：

Answer 2

感谢@Daniel H回答，让我了解了如何快速填写localStorage。最后我找到了这个解决方案：

try{
    var i;
    for (i = 1 ; i <= 10000; i ++) {
        localStorage.setItem('test', new Array(i * 100000).join('a'));
    }
}catch(error){
    console.log("test stopped at i: " + i);
    try{
        var j;
        for (j = 1 ; j <= 100; j++) {
            localStorage.setItem('test2', new Array(j * 1000).join('a'));
        }
    }catch(error){
        console.log("test2 stopped at j: " + j);
        try{
            var k;
            for (k = 1 ; k <= 1000; k++) {
                localStorage.setItem('test3', new Array(k).join('a'));
            }
        }catch(error){
            console.log("test3 stopped at k: " + k);
            console.log("total storage: " + (i * 100000 + j * 1000 + k));
        }
    }
}

首先，我将localStorage填入100000个字符的块中，并将其存储为＆＃34; test＆＃34;在localStorage中。在我超出配额异常后，我以1000个字符的块填充localStorage，直到我再次超出配额异常。最后，我逐个填充localStorage，直到我第三次得到异常。

现在localStorage已经完全填满，我们可以通过添加1个字符来测试它，如下所示：

localStorage.setItem("a","a")

引发exceeded the quota例外。

P.S：我确信此代码可以更加优化。任何优化都非常受欢迎。