Question

我编写了一个webapp，允许您将图像存储在localStorage中，直到您点击保存为止（如果信号很差，它将脱机工作）。

当localStorage达到5MB时，Google Chrome会在javascript控制台日志中产生错误：

未捕获错误：QUOTA_EXCEEDED_ERR：DOM例外22

如何在Google Chrome上增加localStorage配额的大小？

Answer 1

你不能，它的硬连线为5MB。这是design decision by the Chrome developers。

在Chrome中，默认情况下，Web SQL数据库和缓存清单也有较低限制，但是如果您打包Chrome应用商店you can increase them的应用。

另见Managing HTML5 Offline Storage - Google Chrome。

Answer 2

5MB是一个硬限制，这是愚蠢的。 IndexedDB为您提供~50MB，这更合理。为了更容易使用，请尝试使用Dexie.js https://github.com/dfahlander/Dexie.js

<强>更新：

Dexie.js对我的简单键值目的来说实际上仍然是一种矫枉过正，所以我写了这个更简单的脚本https://github.com/DVLP/localStorageDB

这个你有50MB，可以得到和设置这样的值

// Setting values
ldb.set('nameGoesHere', 'value goes here');

// Getting values - callback is required because the data is being retrieved asynchronously:
ldb.get('nameGoesHere', function (value) {
  console.log('And the value is', value);
});

复制/粘贴下面的行，以便ldb.set()和上面示例中的ldb.get()可用。

!function(){function e(t,o){return n?void(n.transaction("s").objectStore("s").get(t).onsuccess=function(e){var t=e.target.result&&e.target.result.v||null;o(t)}):void setTimeout(function(){e(t,o)},100)}var t=window.indexedDB||window.mozIndexedDB||window.webkitIndexedDB||window.msIndexedDB;if(!t)return void console.error("indexDB not supported");var n,o={k:"",v:""},r=t.open("d2",1);r.onsuccess=function(e){n=this.result},r.onerror=function(e){console.error("indexedDB request error"),console.log(e)},r.onupgradeneeded=function(e){n=null;var t=e.target.result.createObjectStore("s",{keyPath:"k"});t.transaction.oncomplete=function(e){n=e.target.db}},window.ldb={get:e,set:function(e,t){o.k=e,o.v=t,n.transaction("s","readwrite").objectStore("s").put(o)}}}();

Answer 3

配额是为用户设置的，他希望允许每个网站留出多少空间。

因此，由于目的是限制网页，因此网页无法更改限制。

如果存储空间不足，您可以提示用户增加本地存储空间。

要确定存储是否较低，您可以通过保存对象然后删除它来探测本地存储大小。

Answer 4

您可以，但如果您在localStorage中保存JSON，则可以使用库来压缩数据，如：https://github.com/k-yak/JJLC

演示：http://k-yak.github.io/JJLC/

有没有办法增加Google Chrome中localStorage的大小以避免QUOTA_EXCEEDED_ERR：DOM例外22

4 个答案: