Javascript 有没有办法在 Google Chrome 中增加 localStorage 的大小以避免 QUOTA_EXCEEDED_ERR: DOM Exception 22

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/5663166/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 18:20:36  来源:igfitidea点击:

Is there a way to increase the size of localStorage in Google Chrome to avoid QUOTA_EXCEEDED_ERR: DOM Exception 22

javascripthtmlgoogle-chromelocal-storage

提问by HM2K

I've written a webapp that allows you to store the images in the localStorage until you hit save (so it works offline, if signal is poor).

我编写了一个 web 应用程序,它允许您将图像存储在 localStorage 中,直到您点击保存(因此它可以离线工作,如果信号很差)。

When the localStorage reaches 5MB Google Chrome produces an error in the javascript console log:

当 localStorage 达到 5MB 时,谷歌浏览器会在 javascript 控制台日志中产生错误:

Uncaught Error: QUOTA_EXCEEDED_ERR: DOM Exception 22

未捕获的错误:QUOTA_EXCEEDED_ERR:DOM 异常 22

How do I increase the size of the localStorage quota on Google Chrome?

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

回答by Liza Daly

You can't, it's hard-wired at 5MB. This is a design decision by the Chrome developers.

你不能,它是 5MB 的硬连线。这是Chrome 开发人员设计决定

In Chrome, the Web SQL db and cache manifest also have low limits by default, but if you package the app for the Chrome App Store you can increase them.

在 Chrome 中,Web SQL db 和缓存清单默认情况下也有较低的限制,但如果您为 Chrome App Store 打包应用程序,则可以增加它们

See also Managing HTML5 Offline Storage - Google Chrome.

另请参阅管理 HTML5 离线存储 - Google Chrome

回答by Pawel

5MB is a hard limit and that is stupid. IndexedDB gives you ~50MB which is more reasonable. To make it easier to use try Dexie.js https://github.com/dfahlander/Dexie.js

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

Update:

更新

Dexie.js was actually still an overkill for my simple key-value purposes so I wrote this much simpler script https://github.com/DVLP/localStorageDB

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

with this you have 50MB and can get and set values like that

有了这个,你有 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);
});

Copy/paste the line below so ldb.set()and ldb.get()from the example above will become available.

复制/粘贴下面的行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)}}}();

回答by Florian Rotagnon

You can't but if you save JSON in your localStorage you can use a library to compress data like : https://github.com/k-yak/JJLC

你不能,但如果你将 JSON 保存在 localStorage 中,你可以使用一个库来压缩数据,如:https: //github.com/k-yak/JJLC

demo : http://k-yak.github.io/JJLC/

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

回答by Ben

The quota is for the userto set, how much space he wishes to allow to each website.

配额是由用户设置的,他希望为每个网站提供多少空间。

Therefore since the purpose is to restrict the web pages, the web pages cannot change the restriction.

因此,由于目的是限制网页,网页不能改变限制。

If storage is low, you can prompt the user to increase local storage.

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

To find out if storage is low, you could probe the local storage size by saving an object then deleting it.

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