¿Existe alguna manera de aumentar el tamaño de localStorage en Google Chrome para evitar QUOTA_EXCEEDED_ERR: DOM Exception 22

Question

He escrito una aplicación web que te permite almacenar las imágenes en el localStorage hasta que presionas guardar (para que funcione sin conexión, si la señal es pobre).

Cuando el localStorage alcanza 5 MB Google Chrome produce un error en el registro de la consola javascript:

Uncaught Error: QUOTA_EXCEEDED_ERR: DOM Exception 22

¿Cómo puedo aumentar el tamaño de la cuota de almacenamiento local en Google Chrome?

Answer 1

La cuota es para el usuario para ajustar, la cantidad de espacio que desea para permitir a cada sitio web.

Por lo tanto, dado que el propósito es restringir las páginas web, las páginas web no pueden cambiar la restricción.

Si el almacenamiento es bajo, puede solicitar al usuario que aumente el almacenamiento local.

Para saber si el almacenamiento es bajo, puede sondear el tamaño de almacenamiento local guardando un objeto y luego eliminándolo.

Answer 2

No se puede, está cableado a 5MB. Este es un design decision by the Chrome developers.

En Chrome, el manifiesto de Web SQL db y caché también tiene límites bajos de manera predeterminada, pero si empaqueta la aplicación para Chrome App Store you can increase them.

Véase también Managing HTML5 Offline Storage - Google Chrome.

Answer 3

No se puede, pero si guarda JSON en su localStorage puede utilizar una biblioteca para comprimir los datos como: https://github.com/k-yak/JJLC

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

Answer 4

5 MB es un límite duro y que es estúpida. IndexedDB te da ~ 50MB que es más razonable. Para que sea más fácil de usar tratar Dexie.js https://github.com/dfahlander/Dexie.js

actualización:

Dexie.js era en realidad todavía una exageración para mis propósitos simples de valores clave así que escribí este guión mucho más simple https://github.com/DVLP/localStorageDB

con esto usted tiene 50 MB y puede obtener y establecer valores como la

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

Copia/pega el siguiente línea de modo ldb.set() y ldb.get() del ejemplo anterior estará disponible.

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