Qual è la dimensione massima dei valori localStorage?

Poiché localStorage (al momento) supporta solo stringhe come valori, e per fare ciò gli oggetti devono essere sottoposti a stringa (memorizzati come stringa JSON) prima di poter essere archiviati, esiste una limitazione definita per quanto riguarda la lunghezza dei valori.

Qualcuno sa se esiste una definizione che si applica a tutti i browser?

Citando l’ articolo di Wikipedia su Web Storage :

Lo storage web può essere visualizzato in modo semplicistico come un miglioramento dei cookie, offrendo una capacità di memorizzazione molto maggiore ( 10 MB per origine in Google Chrome ( https://plus.google.com/u/0/+FrancoisBeaufort/posts/S5Q9HqDB8bh ), Mozilla Firefox e Opera; 10 MB per area di archiviazione in Internet Explorer ) e interfacce programmatiche migliori.

E anche citando un articolo di John Resig [pubblicato a gennaio 2007]:

Spazio di archiviazione

È implicito che, con DOM Storage, si dispone di molto più spazio di archiviazione rispetto alle limitazioni tipiche degli user-agent imposte sui cookie. Tuttavia, la quantità fornita non è definita nella specifica, né è significativamente trasmessa dall’agente utente.

Se guardi il codice sorgente di Mozilla possiamo vedere che 5120KB è la dimensione di archiviazione predefinita per un intero dominio. Questo ti dà molto più spazio di lavoro rispetto a un tipico cookie da 2KB.

Tuttavia, la dimensione di questa area di memoria può essere personalizzata dall’utente (quindi un’area di memoria da 5 MB non è garantita, né è implicita) e l’agente utente (Opera, ad esempio, può fornire solo 3 MB, ma solo il tempo lo dirà. )

In realtà Opera non ha un limite di 5 MB. Offre di aumentare il limite in quanto le applicazioni richiedono di più. L’utente può anche scegliere “Spazio illimitato” per un dominio.

È ansible testare facilmente i limiti / quota di localStorage .

Ecco uno script semplice per scoprire il limite:

 if (localStorage && !localStorage.getItem('size')) { var i = 0; try { // Test up to 10 MB for (i = 250; i <= 10000; i += 250) { localStorage.setItem('test', new Array((i * 1024) + 1).join('a')); } } catch (e) { localStorage.removeItem('test'); localStorage.setItem('size', i - 250); } } 

Ecco il succo , JSFiddle e post sul blog .

Lo script testerà l'impostazione di stringhe di testo sempre più grandi fino a quando il browser non emetterà ed eccezione. A quel punto cancellerà i dati del test e imposterà una chiave di dimensione in localStorage che memorizza la dimensione in kilobyte.

Non supporre che 5MB sia disponibile: la capacità di localStorage varia a seconda del browser, con 2,5 MB, 5 MB e numero illimitato essendo i valori più comuni. Fonte: http://dev-test.nemikor.com/web-storage/support-test/

Trova la lunghezza massima di una singola stringa che può essere memorizzata in localStorage

Questo frammento trova la lunghezza massima di una stringa che può essere memorizzata in localStorage per dominio.

 //Clear localStorage for (var item in localStorage) delete localStorage[item]; window.result = window.result || document.getElementById('result'); result.textContent = 'Test running…'; //Start test //Defer running so DOM can be updated with "test running" message setTimeout(function () { //Variables var low = 0, high = 2e9, half; //Two billion may be a little low as a starting point, so increase if necessary while (canStore(high)) high *= 2; //Keep refining until low and high are equal while (low !== high) { half = Math.floor((high - low) / 2 + low); //Check if we can't scale down any further if (low === half || high === half) { console.info(low, high, half); //Set low to the maximum possible amount that can be stored low = canStore(high) ? high : low; high = low; break; } //Check if the maximum storage is no higher than half if (storageMaxBetween(low, half)) { high = half; //The only other possibility is that it's higher than half but not higher than "high" } else { low = half + 1; } } //Show the result we found! result.innerHTML = 'The maximum length of a string that can be stored in localStorage is ' + low + ' characters.'; //Functions function canStore(strLen) { try { delete localStorage.foo; localStorage.foo = Array(strLen + 1).join('A'); return true; } catch (ex) { return false; } } function storageMaxBetween(low, high) { return canStore(low) && !canStore(high); } }, 0); 
 

LocalStorage single value max length test

Please enable JavaScript

Si noti che la lunghezza di una stringa è limitata in JavaScript; se si desidera visualizzare la quantità massima di dati che possono essere memorizzati in localStorage quando non è limitata a una singola stringa, è ansible utilizzare il codice in questa risposta .

Modifica: i frammenti di stack non supportano localStorage , quindi ecco un collegamento a JSFiddle .

risultati

Chrome (45.0.2454.101): 5242878 caratteri
Firefox (40.0.1): 5242883 caratteri
Internet Explorer (11.0.9600.18036) : 16386 122066 122070 caratteri

Ottengo risultati diversi per ogni esecuzione in Internet Explorer.

Browser per dispositivi mobili:

 Browser | Chrome | Android Browser | Firefox | iOS Safari Version | 40 | 4.3 | 34 | 6-8 Available | 10MB | 2MB | 10MB | 5MB 

Browser desktop:

 Browser | Chrome | Opera | Firefox | Safari | IE Version | 40 | 27 | 34 | 6-8 | 9-11 Available | 10MB | 10MB | 10MB | 5MB | 10MB 

Non si desidera stringificare gli oggetti di grandi dimensioni in una singola voce localStorage. Sarebbe molto inefficiente – l’intera cosa dovrebbe essere analizzata e ricodificata ogni volta che qualche piccolo dettaglio cambia. Inoltre, JSON non può gestire più riferimenti incrociati all’interno di una struttura di oggetti e cancella molti dettagli, ad esempio il costruttore, proprietà non numeriche degli array, cosa c’è in una voce sparsa, ecc.

Invece, puoi usare http://rhaboo.org . Memorizza oggetti di grandi dimensioni utilizzando molte voci di localStorage in modo da poter apportare piccole modifiche rapidamente. Gli oggetti restaurati sono copie molto più accurate di quelle salvate e l’API è incredibilmente semplice. Per esempio:

 var store = Rhaboo.persistent('Some name'); store.write('count', store.count ? store.count+1 : 1); store.write('somethingfancy', { one: ['man', 'went'], 2: 'mow', went: [ 2, { mow: ['a', 'meadow' ] }, {} ] }); store.somethingfancy.went[1].mow.write(1, 'lawn'); 

A proposito, l’ho scritto.

Mi piace molto la risposta di cdmckay , ma non sembra davvero bello controllare le dimensioni in tempo reale: è semplicemente troppo lento (2 secondi per me). Questa è la versione migliorata, che è molto più veloce e più precisa, anche con un’opzione per scegliere quanto può essere grande l’errore (di default 250,000 , l’errore più piccolo è – più lungo è il calcolo):

 function getLocalStorageMaxSize(error) { if (localStorage) { var max = 10 * 1024 * 1024, i = 64, string1024 = '', string = '', // generate a random key testKey = 'size-test-' + Math.random().toString(), minimalFound = 0, error = error || 25e4; // fill a string with 1024 symbols / bytes while (i--) string1024 += 1e16; i = max / 1024; // fill a string with 'max' amount of symbols / bytes while (i--) string += string1024; i = max; // binary search implementation while (i > 1) { try { localStorage.setItem(testKey, string.substr(0, i)); localStorage.removeItem(testKey); if (minimalFound < i - error) { minimalFound = i; i = i * 1.5; } else break; } catch (e) { localStorage.removeItem(testKey); i = minimalFound + (i - minimalFound) / 2; } } return minimalFound; } } 

Testare:

 console.log(getLocalStorageMaxSize()); // takes .3s console.log(getLocalStorageMaxSize(.1)); // takes 2s, but way more exact 

Funziona molto più velocemente per l'errore standard; inoltre può essere molto più preciso quando necessario.

Puoi utilizzare il seguente codice nei browser moderni per controllare in modo efficiente la quota di archiviazione (totale e utilizzata) in tempo reale:

 if ('storage' in navigator && 'estimate' in navigator.storage) { navigator.storage.estimate() .then(estimate => { console.log("Usage (in Bytes): ", estimate.usage, ", Total Quota (in Bytes): ", estimate.quota); }); } 

Sto facendo quanto segue:

 getLocalStorageSizeLimit = function () { var maxLength = Math.pow(2,24); var preLength = 0; var hugeString = "0"; var testString; var keyName = "testingLengthKey"; //2^24 = 16777216 should be enough to all browsers testString = (new Array(Math.pow(2, 24))).join("X"); while (maxLength !== preLength) { try { localStorage.setItem(keyName, testString); preLength = testString.length; maxLength = Math.ceil(preLength + ((hugeString.length - preLength) / 2)); testString = hugeString.substr(0, maxLength); } catch (e) { hugeString = testString; maxLength = Math.floor(testString.length - (testString.length - preLength) / 2); testString = hugeString.substr(0, maxLength); } } localStorage.removeItem(keyName); maxLength = JSON.stringify(this.storageObject).length + maxLength + keyName.length - 2; return maxLength; };