localStorage 값의 최대 크기는 얼마입니까?


543

사람 localStorage(현재) 값만 같은 문자열을 지원하며, 오브젝트들이 저장되기 전에도 캐릭터 라인 (JSON 문자열로 저장) 할 필요가 그렇게하기 위해, 값의 길이에 대하여 정해진 제한이있다.

모든 브라우저에 적용되는 정의가 있는지 아는 사람이 있습니까?


15
나는 실제로 "가치 당 최대 길이"라는 질문에 아무도 대답하지 않았다고 생각합니다.
Pete Alvin



누군가가 @PeteAlvin 그것을 대답 2015 년 다른 답변은 전체 크기에 제한이 있지만 크기에 대한 제한 주소 값 당을 .
Ali

답변:


421

웹 스토리지에 관한 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 만 제공 할 수 있지만 시간 만 알려줄 수 있음)로 사용자 정의 할 수 있습니다 . )


28
@Cupidvogel 아니요, 각각의 domain( origin)는 개별 클라이언트에 5MB를 저장할 수 있습니다. 데이터는 클라이언트 컴퓨터에 저장됩니다.이 localStorage메커니즘은 클라이언트간에 상호 작용 하지 않습니다 .
DanielB

6
아니요, 동일한 도메인의 여러 페이지에서 동일한 데이터에 액세스 할 수 있도록하려고했습니다. 종종 도메인과 페이지의 문구가 동의어로 표시되는 것을 알기 때문에 확실하게 알고 싶었습니다!
SexyBeast

9
그러나 단일 값 에 제한이 있습니까? (저장할 플래그가 많은 경우 단일 속성에서 JSON으로 저장하는 것이 얼마나 안전합니까?)
phtrivier

5
Safari는 5MB에, Chrome 39는 10MB에 있습니다 (5MB에서 언제 업그레이드되었는지 확실하지 않음).이 기사 참조 html5rocks.com/en/tutorials/offline/quota-research
Ally

18
@Cupidvogel : 아니요, 도메인 이 아닙니다 . 동일한 출처 정책과 같은 용어 인 scheme + host + port와 같이 용어가 사용되기 때문에 원점 별로 입니다. http://example.comhttps://example.com같은 원점 (다른 제도)이 아니다. http://example.comhttp://www.example.com같은 원점 (다른 호스트)되지 않습니다. http://example.comhttp://example.com:8080같은 원점 (다른 포트)되지 않습니다. HTH. :-)
TJ Crowder 2019 년

134

실제로 Opera에는 5MB 제한이 없습니다. 응용 프로그램에 더 많은 것이 필요하므로 제한을 늘릴 수 있습니다. 사용자는 도메인에 대해 "무제한 스토리지"를 선택할 수도 있습니다.

localStorage 제한 / 인용을 쉽게 테스트 할 수 있습니다 .


50
더 이상 Chrome을 중단하지 않습니다 ... 재미있는 점 : 5MB는 Chrome에서 250 만 자입니다. 분명히 UFT16은 localStore에 사용됩니다.
Felix Alcala

1
@FelixAlcala 불행히도 Mac OS X에서 Chrome 15.0.874.54 베타가 충돌합니다. 1.500.000 자에서 충돌이 발생했습니다.
Ivan Vučica

내 장치에서 크롬이 충돌하고 bckground를 재설정했지만 놀라지 않았지만 휴대 전화에는 RAM이 거의 없으므로 크롬이 열려있는 동안 어리석은 FLASHLIGHT APP을 열 수 없습니다.
Jack

6
@FelixAlcala-실제로 JavaScript는 노출합니다 UCS-2. 에 그것과 유사하지만 UFT16몇 가지 중요한 차이점이 있습니다 대부분이 UCS-2 선행 UFT 사실을 주위를 맴도는 ....
Jeremy J Starcher

@FelixAlcala 디스크 크기와 같은 문자 수 (예 : 2,700K 문자 ~ = 5,274KB)를 표시하는 것이 좋은 생각이라고 생각하십니까?
AJ Hsu

76

다음은 한계를 찾는 간단한 스크립트입니다.

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

여기 요지 , JSFiddle블로그 게시물 .

스크립트는 브라우저에서 예외가 발생할 때까지 점점 더 큰 텍스트 문자열 설정을 테스트합니다. 이 시점에서 테스트 데이터를 지우고 크기를 킬로바이트 단위로 저장하는 localStorage에서 크기 키를 설정합니다.


1
멋진 솔루션. 이 라이너를 찾았 는데 어떻게 생각하세요?
brasofilo

2
@ brasofilo 나는 하나의 라이너가 5MB를 가지고 있다고 가정하고 사용중인 양을 뺍니다.
cdmckay

Ooook, 확실해 코드와 관련하여 발생하는 문제 는 바이트 단위의 크기를 바이트 단위로 KB, MB, GB로 Javascript로 변환 하는 올바른 방법으로 올바른 결과를 얻을 수 없습니다 ... 내일이 수정되지만 내일 살펴볼 수 있다면, 감사합니다.
brasofilo

1
성능과이 답변의 질 향상 여기
smnbbrv을

2020 년 이며이 답변은 Win10의 바닐라 Chrome 및 Firefox 모두에서 완벽하게 작동하여 크기 = 5000입니다.
A. Chiesa

34

저장할 수있는 단일 문자열의 최대 길이 찾기 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에서 각 실행마다 다른 결과를 얻습니다.


1
웃기는하지만 ~ 1 분 동안 실행 한 후 Edge 브라우저 (Win 10의 경우)에서 테스트하면 간단한 테스트로 강력한 시스템이 중지됩니다. 따라서 결과에 새 데이터를 추가 할 수 없습니다))
vatavale

33

모바일 브라우저 :

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

참조 링크


6
숫자는 어디에서 오는가?
MrD

23
@BehnamMohammadi 당신은 당신이 완전성을 위해 어디에서 왔는지에 대한 참조를 추가 할 수 있습니까
Chris Lang

1
참고 문헌은 아직 작성되지 않았습니다. 그러나 후손의 경우이 숫자는 약간 변경됩니다. 더 많은 브라우저와 현재 정보를 업데이트해야합니다.
Malavos

3
@ChrisLang 추가 링크
Behnam Mohammadi

1
@Malavos 추가 링크
Behnam 모하마디


13

큰 객체를 단일 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, 나는 썼다.


1
고마워 마틴 당신은뿐만 아니라 내 '에본'레포도 확인할 수 있습니다. 지금은 직렬 변환기 일 뿐이며 잉크가 매우 젖어 있지만 벼룩보다 빠르며 다목적입니다. Rhaboo는 곧 내부적으로 사용하도록 변환 될 것입니다.
Adrian 5 월

7
유용하지만 이것이 "localStorage의 최대 크기는 얼마입니까?"라는 질문을 해결하지 못한다고 생각합니다. 이 라이브러리가 크기 제한을 초과하여 무언가를 저장하려고 할 때 발생하는 일과 이에 대응하는 방법을 명시하면 답변을 향상시킬 수 있습니다.
Chris Moschini

6

나는 다음을하고있다 :

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

5
Maroun Maroun : 게시물을 다시 확인하십시오. 작성자는 로컬 저장소의 최대 크기를 프로그래밍 방식으로 확인하는 코드를 제공했습니다. 이것은 다른 질문이 아닌 올바른 답변 인 것 같습니다.
Arend

이 코드를 실행하면 작성 시점을 기준으로 Chrome에서 "잘못된 반환 문"오류가 발생합니다.
DrewT

6

나는 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

이것은 표준 오류에 대해 훨씬 빠르게 작동합니다. 또한 필요할 때 훨씬 더 정확할 수 있습니다.


6

내가 사용하는이 기능에 바이너리 테스트를 압축했습니다.

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 바이트)를보고합니다.


1
(그리고 localStorage.Clear()테스트 전후에 잊지 마십시오
simonmysun

5

최신 브라우저에서 다음 코드를 사용하여 스토리지 할당량 (총 및 사용)을 실시간으로 효율적으로 확인할 수 있습니다.

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

Chrome에서는 제대로 작동하지 않습니다. Usage (in Bytes): 647 , Total Quota (in Bytes): 32901464711 그것은 틀렸다 : 가능한 전체 크기는 실제로 10485762이다.
James Wilkins

1

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'값 설정이 할당량을 초과했습니다.


0

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

여기에 이미지 설명을 입력하십시오

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.