Qual é o tamanho máximo dos valores localStorage?
Uma vez que localStorage
(actualmente) só suporta strings como valores, e para que os objectos precisem de ser stringificados (armazenados como JSON-string) antes de poderem ser armazenados, existe uma limitação definida em relação ao comprimento dos valores.
10 answers
Citando o artigo do Wikipedia no armazenamento Web:
Armazenamento na Web podem ser visualizadas de modo simplista como uma melhoria sobre os cookies, proporcionando maior capacidade de armazenamento (10 MB por origem no Google Chrome(https://plus.google.com/u/0/+FrancoisBeaufort/posts/S5Q9HqDB8bh), Mozilla Firefox e Opera; 10 MB por área de armazenamento no Internet Explorer) e a melhor programação de interfaces.
E também citando de um John Resig artigo [publicado em janeiro de 2007]:
Espaço De Armazenamento
Está implícito que, com o armazenamento DOM, você tem consideravelmente mais armazenamento espaço que o agente de utilizador típico limitações impostas aos Cookies. No entanto, o montante que é fornecido não está definido no caderno de especificações, nem é transmitido de forma significativa por o agente do utilizador.
Se olhar para o código fonte Mozilla podemos ver que 5120KB é o padrão Tamanho do armazenamento para um todo dominio. Isso lhe dá consideravelmente mais espaço para trabalhar com que um típico 2KB biscoito.
No entanto, o tamanho desta área de armazenamento pode ser personalizado pelo utilizador (de modo a Área de armazenamento 5MB não é garantida, também não está implícito) e o agente de utilizador (A ópera, por exemplo, só pode fornecer 3MB - mas só o tempo dirá.)
Pode facilmentetestar limites de localização/quota para si próprio.
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);
}
}
Aqui está o essencial., jsFiddle e post no blog .
O programa irá testar a configuração de cadeias de texto cada vez maiores até o navegador lançar e abrir uma excepção. Nesse ponto, ele vai limpar os dados do teste e definir uma chave de tamanho em localStorage armazenando o tamanho em kilobytes.
Não assuma que o 5MB está disponível - a capacidade de armazenamento local varia de navegador, com 2,5 MB, 5MB e ilimitado sendo os valores mais comuns. Fonte: http://dev-test.nemikor.com/web-storage/support-test/
Encontre o comprimento máximo de uma única cadeia que possa ser armazenada em localStorage
Este excerto irá encontrar o comprimento máximo de uma cadeia de caracteres que pode ser armazenada em localStorage
por domínio.
//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 <strong>' + low + '</strong> 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);
<h1>LocalStorage single value max length test</h1>
<div id='result'>Please enable JavaScript</div>
Note que o comprimento de uma seqüência de caracteres é limitado em JavaScript; se você deseja exibir a quantidade máxima de dados que pode ser armazenado em localStorage
quando não se limita a uma única cadeia de caracteres, você pode usar o código esta resposta.
Editar: os excertos da pilha não suportam localStorage
, então Aqui está um link para JSFiddle.
Resultados
Chrome (45.0.2454.101): 5242878 caracteres
Firefox (40.0.1): 5242883 caracteres
Internet Explorer (11.0.9600.18036): 16386 122066 122070 caracteres
Não queres pendurar objectos grandes numa única entrada de localização. Isso seria muito ineficiente-tudo teria de ser analisado e re-codificado sempre que alguns pequenos detalhes mudassem. Além disso, JSON não pode lidar com várias referências cruzadas dentro de uma estrutura de objeto e elimina muitos detalhes, por exemplo, o construtor, propriedades não-numéricas de arrays, o que está em uma entrada esparsa, etc.
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');
Já agora, fui eu que a escrevi.
Navegadores móveis:
Browser | Chrome | Android Browser | Firefox | iOS Safari
Version | 40 | 4.3 | 34 | 6-8
Available | 10MB | 2MB | 10MB | 5MB
Navegadores de secretária:
Browser | Chrome | Opera | Firefox | Safari | IE
Version | 40 | 27 | 34 | 6-8 | 9-11
Available | 10MB | 10MB | 10MB | 5MB | 10MB
Eu realmente gosto da resposta do cdmckay, mas não parece muito bom verificar o tamanho em tempo real: é muito lento (2 segundos para mim). Esta é a versão melhorada, que é muito mais rápida e mais exata, também com uma opção para escolher quão grande o erro pode ser (default 250,000
, o erro menor é-quanto mais longo o cálculo é):
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;
}
}
Para testar:
console.log(getLocalStorageMaxSize()); // takes .3s
console.log(getLocalStorageMaxSize(.1)); // takes 2s, but way more exact
Isso funciona dramaticamente mais rápido para o erro padrão; também pode ser muito mais exato quando necessario.
Você pode usar o seguinte código em navegadores modernos para verificar eficientemente a quota de armazenamento (total e usado) em tempo real:
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);
});
}
Estou a fazer o seguinte:
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;
};