超过 localStorage 配额（localStorage 大小！= 文件下载大小）& 如何检查 localStorage 大小答案

【问题标题】：exceeding localStorage Quota (localStorage size != file download size) & how to check localStorage size超过 localStorage 配额（localStorage 大小！= 文件下载大小）& 如何检查 localStorage 大小
【发布时间】：2011-08-14 10:03:00
【问题描述】：

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

我正在做的是创建一个离线 HTML5 网络应用程序。 “出于某些原因”我不希望将某些文件放在缓存清单中，而是希望将内容放在 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 中存储的最长字符串大约是 2,500,000 个字符？

【问题讨论】：

diveintohtml5.org/storage.html#limitations 说你应该有 5mb，其他 stackoverflow 问题证实了这一点。编写一个循环、存储 1 个字符、将其拉出、存储 2 个字符等，直到达到限制怎么样？
谢谢，布鲁斯。我知道 5mb 的限制，但我很困惑，因为我只提供 localStorage 3mb。我没有考虑到 sqlite 的“开销”。...顺便说一句，你的想法很有趣，我想我会尝试一下，只要看看它有多慢 :) j/k :)跨度>

标签： javascript caching local-storage

【解决方案1】：

奇怪的是，会接受说明最大金额的答案。您不应该验证所有 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;}

【讨论】：

(1) 目标不是计算 localStorage 中剩余多少空间，而是为什么理论上的 limit之间存在明显差异> 以及实际能够存储多少个字符。所选答案表明这是一个编码问题。 (2) 您的代码假定限制为 5242880 个字符，这并非对所有浏览器都有效。
您能否提供每个浏览器的这些限制列表？
这是另一个答案中提到的一个很好的资源：@987654323@。没有给出确切的限制，而是一个范围。您可以以此为起点，朝着确切的极限努力。
奇怪，根据 w3c 规范 w3.org/TR/webstorage/#disk-space 他们都应该使用 5MB

【解决方案2】：

了解本地存储中可以存储多少字符的好方法是通过该链接对其进行测试：http://arty.name/localstorage.html。

大小取决于浏览器 HTML5 实现

我的最后一次测试： Chrome 13/Safari 5/IPAD 2：2.600.000 chr 火狐 4 : 5.200.000 歌剧 11：无限制

【讨论】：

【解决方案3】：

http://jsfiddle.net/brucealdridge/j6KdJ/ 2,500,000 个字符适用于我的 (“5.0 (X11; Linux i686) AppleWebKit/534.30 (KHTML, like Gecko) Ubuntu/10.10 Chromium/12.0.742.9 Chrome/12.0.742.9 Safari/534.30”) 3,000,000 没有。我在想这可能是我编码的东西，但我刚刚检查过，它不是

【讨论】：

+1。感谢您提供方便的脚本。我能够使用 Chrome 11.0.696.57 在 MAC OS 10.6.6 上写入最多 2,605,000 字符...嗯，我想我毕竟必须使用缓存清单，因为它几乎可以存储任何文件正如你所服务的那样。谢谢，布鲁斯。
找到了答案......它正在编码......请参阅stackoverflow.com/questions/2747285/…它在问题的 cmets 中“基于 Webkit 的浏览器使用 UTF-16 进行存储，其限制为 2.5MB”
啊，真不幸。谢谢你的信息，布鲁斯！我已经重写了我的应用程序以使用这些 JSON 文件的缓存清单。