javascript - localstorage容量 - localStorage值的最大大小是多少?




js localstorage (6)

由于localStorage (当前)仅支持将字符串作为值,并且为了这样做,在存储对象之前需要将对象字符串化(存储为JSON字符串),是否存在对值长度的限定。

有谁知道是否有适用于所有浏览器的定义?


查找可存储在localStorage中的单个字符串的最大长度

这段代码将查找可存储在每个域的localStorage中的字符串的最大长度。

//Clear localStorage
for (var item in localStorage) delete localStorage[item];

window.result = window.result || document.getElementById('result');

result.textContent = 'Test running…';

//Start test
//Defer running so DOM can be updated with "test running" message
setTimeout(function () {

    //Variables
    var low = 0,
        high = 2e9,
        half;

    //Two billion may be a little low as a starting point, so increase if necessary
    while (canStore(high)) high *= 2;


    //Keep refining until low and high are equal
    while (low !== high) {
        half = Math.floor((high - low) / 2 + low);

        //Check if we can't scale down any further
        if (low === half || high === half) {
            console.info(low, high, half);
            //Set low to the maximum possible amount that can be stored 
            low = canStore(high) ? high : low;
            high = low;
            break;
        }


        //Check if the maximum storage is no higher than half
        if (storageMaxBetween(low, half)) {
            high = half;
            //The only other possibility is that it's higher than half but not higher than "high"
        } else {
            low = half + 1;
        }

    }

    //Show the result we found!
    result.innerHTML = 'The maximum length of a string that can be stored in localStorage is <strong>' + low + '</strong> characters.';

    //Functions
    function canStore(strLen) {
        try {
            delete localStorage.foo;
            localStorage.foo = Array(strLen + 1).join('A');
            return true;
        } catch (ex) {
            return false;
        }
    }


    function storageMaxBetween(low, high) {
        return canStore(low) && !canStore(high);
    }

}, 0);
<h1>LocalStorage single value max length test</h1>

<div id='result'>Please enable JavaScript</div>

请注意,JavaScript中的字符串长度是有限的; 如果您希望查看不限于单个字符串时可存储在localStorage的最大数据量,则可以使用此答案中的代码 。

编辑: Stack Snippets不支持localStorage ,所以这里是JSFiddle的链接

结果

Chrome(45.0.2454.101): 5242878个字符
Firefox(40.0.1): 5242883个字符
Internet Explorer(11.0.9600.18036) 16386 122066 122070个字符

每次在Internet Explorer中运行时都会得到不同的结果。


移动浏览器:

Browser    | Chrome    | Android Browser    | Firefox     | iOS Safari
Version    | 40        | 4.3                | 34          | 6-8
Available  | 10MB      | 2MB                | 10MB        | 5MB

桌面浏览器:

Browser    | Chrome   | Opera    | Firefox    | Safari      | IE
Version    | 40       | 27       | 34         | 6-8         | 9-11
Available  | 10MB     | 10MB     | 10MB       | 5MB         | 10MB

维基百科文章引用Web存储

Web存储可以简单地看作是对cookie的改进,提供更大的存储容量( 谷歌浏览器中的每个来源10 MB( https://plus.google.com/u/0/+FrancoisBeaufort/posts/S5Q9HqDB8bh ),Mozilla Firefox ,Opera; Internet Explorer中每个存储区10 MB )以及更好的编程接口。

并且引用John Resig的文章 [2007年1月发布]:

储存空间

这意味着,使用DOM存储,您的存储空间将大大超过对Cookie所施加的典型用户代理限制。 但是,提供的数量并未在规范中定义,也不由用户代理进行有意义的广播。

如果您查看Mozilla源代码,我们可以看到5120KB是整个域的默认存储大小。 与典型的2KB cookie相比,这为您提供了更多的空间。

但是,这个存储区域的大小可以由用户自定义 (所以不保证5MB的存储区域,也不暗示),用户代理(例如,Opera可能只提供3MB - 但只有时间才能说明问题。 )


以下是找出限制的简单脚本:

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);            
    }
}

这是JSFiddle博客文章 的要点

该脚本将测试设置越来越大的文本字符串,直到浏览器抛出异常。 此时,它将清除测试数据,并在localStorage中设置一个大小键(以千字节为单位)。


您不想将大对象串入一个localStorage条目中。 这将是非常低效的 - 整个事情将不得不被解析,并重新编码每次细微的细节变化。 另外,JSON不能处理对象结构中的多个交叉引用,并且消除了很多细节,例如构造函数,数组的非数值属性,稀疏条目中的内容等。

相反,你可以使用http://rhaboo.org 。 它使用大量localStorage条目存储大型对象,以便您可以快速进行小的更改。 恢复的对象是保存的更加准确的副本,并且API非常简单。 例如:

var store = Rhaboo.persistent('Some name');
store.write('count', store.count ? store.count+1 : 1);
store.write('somethingfancy', {
  one: ['man', 'went'],
  2: 'mow',
  went: [  2, { mow: ['a', 'meadow' ] }, {}  ]
});
store.somethingfancy.went[1].mow.write(1, 'lawn');

顺便说一句,我写了。


我正在做以下事情:

getLocalStorageSizeLimit = function () {

    var maxLength = Math.pow(2,24);
    var preLength = 0;
    var hugeString = "0";
    var testString;
    var keyName = "testingLengthKey";

    //2^24 = 16777216 should be enough to all browsers
    testString = (new Array(Math.pow(2, 24))).join("X");

    while (maxLength !== preLength) {
        try  {
            localStorage.setItem(keyName, testString);

            preLength = testString.length;
            maxLength = Math.ceil(preLength + ((hugeString.length - preLength) / 2));

            testString = hugeString.substr(0, maxLength);
        } catch (e) {
            hugeString = testString;

            maxLength = Math.floor(testString.length - (testString.length - preLength) / 2);
            testString = hugeString.substr(0, maxLength);
        }
    }

    localStorage.removeItem(keyName);

    maxLength = JSON.stringify(this.storageObject).length + maxLength + keyName.length - 2;

    return maxLength;
};






local-storage