Каков максимальный размер значений localStorage?

397

Так как localStorage (в настоящее время) поддерживает только строки как значения, и для этого необходимо, чтобы объекты были стягированы (сохранены как JSON-строка), прежде чем они могут быть сохранены, существует ли определенное ограничение относительно длины значения.

Кто-нибудь знает, есть ли определение, которое применяется ко всем браузерам?

  • 12
    Я думаю, что на самом деле никто не ответил на вопрос «Максимальная длина на значение».
  • 0
    @PeteAlvin Я только что ответил на вопрос .
Показать ещё 1 комментарий
Теги:
local-storage

10 ответов

342
Лучший ответ

Цитата из Статья в Википедии о веб-хранилище:

Веб-хранилище можно рассматривать упрощенно как усовершенствование куки файлов, обеспечивая гораздо большую емкость хранилища (10 МБ на каждое происхождение в Google Chrome (https://plus.google.com/u/0/+FrancoisBeaufort/posts/S5Q9HqDB8bh), Mozilla Firefox и Opera, 10 МБ на область хранения в Internet Explorer) и улучшенные программные интерфейсы.

А также цитирование из статьи Джона Ресига [опубликовано в январе 2007 года]:

Место для хранения

Подразумевается, что с DOM Storage, у вас значительно больше памяти чем обычный пользовательский агент ограничения, налагаемые на Cookies. Однако сумма, которая предоставляется не определен в спецификации, равно как и пользовательский агент.

Если вы посмотрите исходный код Mozilla мы видим, что 5120KB является значением по умолчанию размер хранилища для всего домена. Это дает вам значительно больше места для работы с чем типичный 2 КБ печенье.

Однако размер этой области хранения могут быть настроены пользователем (так что Зона хранения 5 МБ не гарантируется, и не подразумевается), и пользовательский агент (Например, Opera может предоставить только 3MB - но покажет только время.)

  • 0
    Я не поняла немного per origin ? Если на сайте foo.com будет 200 пользователей, будет ли это 5 МБ для всех этих 200 пользователей, просматривающих эту страницу?
  • 23
    @Cupidvogel нет, это означает, что каждый domain ( origin ) может хранить 5 МБ на любом отдельном клиенте. Данные хранятся на клиентском компьютере - никоим образом механизм localStorage взаимодействует между клиентами.
Показать ещё 12 комментариев
117

На самом деле Opera не имеет ограничения на 5 МБ. Он предлагает увеличить лимит, поскольку приложения требуют больше. Пользователь может даже выбрать "Неограниченное хранилище" для домена.

Вы можете легко проверить локальные ограничения/квоту.

  • 46
    Chrome больше не рушится ... Интересный момент: 5 МБ равны 2,5 миллионам символов в Chrome. Итак, по-видимому, UFT16 используется для localStore.
  • 1
    @FelixAlcala К сожалению, это приводит к сбою бета-версии Chrome 15.0.874.54 на Mac OS X. У меня был сбой в 1.500.000 символов.
Показать ещё 4 комментария
61

Здесь простой script для определения предела:

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 и размещать.

script будет проверять установку более значительных строк текста до тех пор, пока броузер и исключение браузера не будут выполнены. В этот момент он очистит тестовые данные и установит ключ размера в localStorage, сохраняя размер в килобайтах.

  • 1
    Классное решение. Я нашел этот лайнер , что ты думаешь?
  • 2
    @brasofilo Я думаю, что один лайнер предполагает, что у вас есть 5 МБ, а затем вычитает используемую сумму.
Показать ещё 2 комментария
24

Не предполагайте, что доступно 5 МБ - емкость локального хранилища зависит от браузера, с 2,5 МБ, 5 МБ и неограниченным - это наиболее распространенные значения. Источник: http://dev-test.nemikor.com/web-storage/support-test/

20

Найти максимальную длину одной строки, которая может быть сохранена в 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 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
    Забавно, но ваш простой тест останавливает мою довольно мощную систему, когда я тестирую в браузере Edge (на Win 10) после ~ 1 минуты запуска. Поэтому я не могу добавить новые данные к вашим результатам))
  • 0
    Вы сэкономили 15 минут на тестировании, спасибо
13

Мобильные браузеры:

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
  • 5
    Откуда приходят цифры?
  • 0
    @MrD из блога разработчиков Google
Показать ещё 2 комментария
12

Вы не хотите выделять большие объекты в одну запись localStorage. Это было бы очень неэффективно - все это нужно было бы анализировать и перекодировать каждый раз, когда некоторые незначительные изменения деталей. Кроме того, JSON не может обрабатывать множество перекрестных ссылок внутри структуры объекта и вытирает много деталей, например. конструктор, нечисловые свойства массивов, что в разреженной записи и т.д.

Вместо этого вы можете использовать http://rhaboo.org. Он хранит большие объекты, используя множество записей 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');

Кстати, я написал это.

  • 1
    Спасибо Мартин. С таким же успехом вы можете проверить мой репозиторий 'evon'. Сейчас это всего лишь сериализатор, и чернила очень влажные, но они быстрее, чем rhaboo, и в равной степени универсальны. Rhaboo скоро будет преобразован, чтобы использовать его внутри.
  • 3
    Полезно, но я не думаю, что это решает вопрос "Каков максимальный размер localStorage;" Ваш ответ может быть улучшен, если указать, что происходит, когда эта библиотека пытается сохранить что-то сверх предельного размера, и как на это реагировать.
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

Это работает значительно быстрее для стандартной ошибки; также он может быть намного точнее, когда это необходимо.

4

Вы можете использовать следующий код в современных браузерах, чтобы эффективно проверять квоту хранилища (общая и используемая) в режиме реального времени:

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);
            });
}
  • 0
    Не работает для Chrome. Usage (in Bytes): 647 , Total Quota (in Bytes): 32901464711 Это неверно: возможный общий размер фактически равен 10485762.
3

Я делаю следующее:

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
    Марун Марун: Проверьте почту еще раз, автор предоставил код для программной проверки максимального размера локального хранилища. Это действительно правильный ответ, а не другой вопрос.
  • 0
    Выполнение этих кодов приводит к появлению ошибки «Неверный оператор возврата» в Chrome на момент написания

Ещё вопросы

Сообщество Overcoder
Наверх
Меню