超出localStorage配额(localStorage大小!=文件下载大小)&如何检查localStorage大小

Question

我想不出一个好的标题，所以希望这能行。

我正在做的是创建一个离线的HTML5 webapp应用程序。“出于某些原因”，我不希望将某些文件放在缓存清单中，而是希望将内容放在localStorage中。

所有测试均在Google Chrome for Mac/Mac OS 10.6.6中完成

我有4个.JSON文件，它们的总大小正好是3,120,792字节。在第一次访问(在线)这个应用程序时，我拉下这个JSON内容并将其放入一个字符串变量中，比如str。在存储JSON字符串之前，我剥离了所有的\n和\t，并用'替换\"，以最小化字符串长度。

以下是字符串长度( Chrome控制台中的str.length)：

original str : 3,117,764 (this is a concatenation of the contents of the 4 JSON files)
reformatted JSON: 2,732,249 (not too shabby - should save me a few bytes)

但是，现在当我尝试在localStorage中存储这个字符串时，我得到了一个错误，我已经超过了缓存大小(Error: QUOTA_EXCEEDED_ERR: DOM Exception 22)。但是这个页面没有缓存任何东西(我已经手动删除了所有Google Chrome缓存文件)。

为什么会发生这种情况？

当存储在缓存中时，字符串的大小是多少？

如何最小化此大小以最大限度地利用localStorage？

编辑后添加:我已经尝试将字符串中的1,000,000个字符保存到localStorage (localStorage.setItem('x',str.substr(1,1000000))中。当我检查Chrome缓存文件夹中的localStorage文件大小时，它是2MB。这是一个sqlite数据库。看起来浏览器使用的是实际的localStorage数据库大小，而不是存储在其中的数据的大小。这当然很糟糕，但可能是标准行为。我猜您在localStorage中可以存储的最长字符串大约是2500,000个字符？

Answer 1

http://jsfiddle.net/brucealdridge/j6KdJ/ 2,500,000个字符可以在我的浏览器上运行("5.0 (X11；Linux i686) AppleWebKit/534.30 (KHTML，像Gecko) Ubuntu/10.10Chromium/12.0.742.9Chrome/12.0.742.9Safari/534.30“) 3,000,000个字符不能在我的浏览器上运行。

Answer 2

要了解本地存储中可以存储多少个字符，一个好方法是测试它，这要归功于链接：http://arty.name/localstorage.html。

浏览器HTML5实现的大小待定

我的最后一个测试: Chrome 13/Safari 5/ IPAD 2 :2.600.000 chr FIREFOX 4: 5.200.000 OPERA 11 :无限

Answer 3

奇怪的是，一个说明最大金额的答案会被接受。您不应该验证所有localStorage键/值对的当前大小减去浏览器实现的最大限制吗？

下面是一个jsfiddle来说明这种用法。对于那些想要一个简单的答案的人，可以使用下面的js…

 function _calc() { return 1024 * 1024 * 5 - unescape(encodeURIComponent(JSON.stringify(localStorage))).length; }

更新:这个snippit要准确得多。

function _calc(s){var c,e=s||window.localStorage;for(var k in e){if(e.hasOwnProperty(k)){c+=e[k];}}return c?3+((c.length*16)/(8*1024)):0;}