사람 localStorage
(현재) 값만 같은 문자열을 지원하며, 오브젝트들이 저장되기 전에도 캐릭터 라인 (JSON 문자열로 저장) 할 필요가 그렇게하기 위해, 값의 길이에 대하여 정해진 제한이있다.
모든 브라우저에 적용되는 정의가 있는지 아는 사람이 있습니까?
사람 localStorage
(현재) 값만 같은 문자열을 지원하며, 오브젝트들이 저장되기 전에도 캐릭터 라인 (JSON 문자열로 저장) 할 필요가 그렇게하기 위해, 값의 길이에 대하여 정해진 제한이있다.
모든 브라우저에 적용되는 정의가 있는지 아는 사람이 있습니까?
답변:
웹 스토리지에 관한 Wikipedia 기사에서 인용 :
웹 스토리지는 쿠키 개선으로 단순화되어 훨씬 더 큰 스토리지 용량을 제공 할 수 있습니다 ( Google Chrome에서 원 본당 10MB ( https://plus.google.com/u/0/+FrancoisBeaufort/posts/S5Q9HqDB8bh ), Mozilla Firefox , Opera (Internet Explorer의 저장 영역 당 10MB ) 및 더 나은 프로그래밍 인터페이스.
또한 John Resig 기사 에서 인용 한 내용 [2007 년 1 월 게시] :
저장 공간
DOM 스토리지를 사용하면 쿠키에 부과 된 일반적인 사용자 에이전트 제한보다 상당히 많은 스토리지 공간이 있음을 의미합니다. 그러나, 제공되는 양은 본 명세서에서 정의되지 않았으며, 사용자 에이전트에 의해 의미있게 브로드 캐스트되지도 않는다.
Mozilla 소스 코드를 보면 5120KB가 전체 도메인의 기본 저장소 크기임을 알 수 있습니다. 따라서 일반적인 2KB 쿠키보다 훨씬 더 많은 공간을 사용할 수 있습니다.
그러나이 저장 영역의 크기는 사용자 (5MB 저장 영역이 보장되지 않거나 암시되지 않음)와 사용자 에이전트 (예 : Opera, 예를 들어 3MB 만 제공 할 수 있지만 시간 만 알려줄 수 있음)로 사용자 정의 할 수 있습니다 . )
domain
( origin
)는 개별 클라이언트에 5MB를 저장할 수 있습니다. 데이터는 클라이언트 컴퓨터에 저장됩니다.이 localStorage
메커니즘은 클라이언트간에 상호 작용 하지 않습니다 .
http://example.com
와 https://example.com
같은 원점 (다른 제도)이 아니다. http://example.com
와 http://www.example.com
같은 원점 (다른 호스트)되지 않습니다. http://example.com
와 http://example.com:8080
같은 원점 (다른 포트)되지 않습니다. HTH. :-)
실제로 Opera에는 5MB 제한이 없습니다. 응용 프로그램에 더 많은 것이 필요하므로 제한을 늘릴 수 있습니다. 사용자는 도메인에 대해 "무제한 스토리지"를 선택할 수도 있습니다.
localStorage 제한 / 인용을 쉽게 테스트 할 수 있습니다 .
UCS-2
. 에 그것과 유사하지만 UFT16
몇 가지 중요한 차이점이 있습니다 대부분이 UCS-2 선행 UFT 사실을 주위를 맴도는 ....
다음은 한계를 찾는 간단한 스크립트입니다.
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);
}
}
스크립트는 브라우저에서 예외가 발생할 때까지 점점 더 큰 텍스트 문자열 설정을 테스트합니다. 이 시점에서 테스트 데이터를 지우고 크기를 킬로바이트 단위로 저장하는 localStorage에서 크기 키를 설정합니다.
localStorage
이 스 니펫은 localStorage
도메인 당 저장할 수있는 문자열의 최대 길이를 찾습니다 .
//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>
문자열의 길이는 JavaScript에서 제한됩니다. localStorage
단일 문자열로 제한되지 않을 때 저장할 수있는 최대 데이터 양을 보려면 이 답변의 코드를 사용할 수 있습니다 .
편집 : 스택 조각은 지원하지 않습니다 localStorage
그래서, 여기 JSFiddle에 대한 링크입니다 .
Chrome (45.0.2454.101) : 5242878 자
Firefox (40.0.1) : 5242883 자
Internet Explorer (11.0.9600.18036) :16386 122066 122070 자
Internet Explorer에서 각 실행마다 다른 결과를 얻습니다.
Browser | Chrome | Android Browser | Firefox | iOS Safari
Version | 40 | 4.3 | 34 | 6-8
Available | 10MB | 2MB | 10MB | 5MB
Browser | Chrome | Opera | Firefox | Safari | IE
Version | 40 | 27 | 34 | 6-8 | 9-11
Available | 10MB | 10MB | 10MB | 5MB | 10MB
5MB를 사용할 수 있다고 가정하지 마십시오. localStorage 용량은 브라우저에 따라 다르며 2.5MB, 5MB 및 무제한이 가장 일반적인 값입니다. 출처 : http://dev-test.nemikor.com/web-storage/support-test/
큰 객체를 단일 localStorage 항목으로 문자열 화하지 않으려 고합니다. 그것은 매우 비효율적입니다. 약간의 세부 사항이 바뀔 때마다 모든 것이 구문 분석되고 다시 인코딩되어야합니다. 또한 JSON은 객체 구조 내에서 여러 개의 상호 참조를 처리 할 수 없으며 생성자, 배열의 비 숫자 속성, 스파 스 항목의 내용 등 많은 세부 정보를 제거합니다.
대신 Rhaboo 를 사용할 수 있습니다 . 많은 localStorage 항목을 사용하여 큰 개체를 저장하므로 작은 변경을 신속하게 수행 할 수 있습니다. 복원 된 객체는 저장된 객체의 훨씬 정확한 사본이며 API는 매우 간단합니다. 예 :
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');
BTW, 나는 썼다.
나는 다음을하고있다 :
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;
};
나는 cdmckay의 답변을 정말로 좋아 하지만 실시간으로 크기를 확인하는 것은 좋지 않습니다. 너무 느립니다 (2 초). 이것은 개선 된 버전으로, 더 빠르고 정확하며 오류의 크기를 선택할 수있는 옵션이 있습니다 (기본값 250,000
은 오류가 작을수록 계산 시간이 길어짐).
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;
}
}
테스트하려면 :
console.log(getLocalStorageMaxSize()); // takes .3s
console.log(getLocalStorageMaxSize(.1)); // takes 2s, but way more exact
이것은 표준 오류에 대해 훨씬 빠르게 작동합니다. 또한 필요할 때 훨씬 더 정확할 수 있습니다.
내가 사용하는이 기능에 바이너리 테스트를 압축했습니다.
function getStorageTotalSize(upperLimit/*in bytes*/) {
var store = localStorage, testkey = "$_test"; // (NOTE: Test key is part of the storage!!! It should also be an even number of characters)
var test = function (_size) { try { store.removeItem(testkey); store.setItem(testkey, new Array(_size + 1).join('0')); } catch (_ex) { return false; } return true; }
var backup = {};
for (var i = 0, n = store.length; i < n; ++i) backup[store.key(i)] = store.getItem(store.key(i));
store.clear(); // (you could iterate over the items and backup first then restore later)
var low = 0, high = 1, _upperLimit = (upperLimit || 1024 * 1024 * 1024) / 2, upperTest = true;
while ((upperTest = test(high)) && high < _upperLimit) { low = high; high *= 2; }
if (!upperTest) {
var half = ~~((high - low + 1) / 2); // (~~ is a faster Math.floor())
high -= half;
while (half > 0) high += (half = ~~(half / 2)) * (test(high) ? 1 : -1);
high = testkey.length + high;
}
if (high > _upperLimit) high = _upperLimit;
store.removeItem(testkey);
for (var p in backup) store.setItem(p, backup[p]);
return high * 2; // (*2 because of Unicode storage)
}
또한 테스트하기 전에 내용을 백업 한 다음 복원합니다.
작동 방식 : 한계에 도달하거나 테스트에 실패 할 때까지 크기가 두 배가됩니다. 그런 다음 낮음과 높음 사이의 거리를 절반으로 저장하고 매번 절반의 절반을 빼거나 더합니다 (실패시 빼고 성공시 추가). 적절한 가치로 연마.
upperLimit
기본적으로 1GB이며 이진 검색을 시작하기 전에 지수 적으로 스캔하는 거리를 제한합니다. 나는 이것이 바뀔 필요가 있을지 모른다. 그러나 나는 항상 앞서 생각하고있다. ;)
Chrome에서 :
> getStorageTotalSize();
> 10485762
> 10485762/2
> 5242881
> localStorage.setItem("a", new Array(5242880).join("0")) // works
> localStorage.setItem("a", new Array(5242881).join("0")) // fails ('a' takes one spot [2 bytes])
IE11, Edge 및 FireFox도 동일한 최대 크기 (10485762 바이트)를보고합니다.
localStorage.Clear()
테스트 전후에 잊지 마십시오
최신 브라우저에서 다음 코드를 사용하여 스토리지 할당량 (총 및 사용)을 실시간으로 효율적으로 확인할 수 있습니다.
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);
});
}
Usage (in Bytes): 647 , Total Quota (in Bytes): 32901464711
그것은 틀렸다 : 가능한 전체 크기는 실제로 10485762이다.
Chrome (데스크톱 브라우저) 확장 프로그램을 개발 하고이 이유로 Local Storage 실제 최대 크기를 테스트 한 후
내 결과 :
Ubuntu 18.04.1 LTS (64-bit)
Chrome 71.0.3578.98 (Official Build) (64-bit)
Local Storage content size 10240 KB (10 MB)
10240 KB
사용법 보다 더 많은 오류가 발생했습니다.
catch되지 않은 DOMException : 'Storage'에서 'setItem'을 (를) 실행하지 못했습니다. 'notes'값 설정이 할당량을 초과했습니다.
localStorage 크기를 바이트 단위로 테스트하는이 간단한 코드를 작성했습니다.
https://github.com/gkucmierz/Test-of-localStorage-limits-quota
const check = bytes => {
try {
localStorage.clear();
localStorage.setItem('a', '0'.repeat(bytes));
localStorage.clear();
return true;
} catch(e) {
localStorage.clear();
return false;
}
};
Github 페이지 :
https://gkucmierz.github.io/Test-of-localStorage-limits-quota/
데스크탑 크롬, 오페라, 파이어 폭스, 용감한 및 모바일 크롬에서 ~ 5MB 인 동일한 결과가 있습니다.
그리고 절반 작은 결과 사파리 ~ 2Mbytes