Расчет использования локального пространства

Question

Я создаю приложение, используя Bespin Editor и LocalStorage HTML5. Он хранит все файлы локально и помогает с грамматикой, использует jslint и некоторых других парсеров для CSS и HTML для помощи пользователю.

Я хочу рассчитать, сколько было использовано пределов LocalStorage и насколько на самом деле есть. Это возможно сегодня? Я думал, что не просто рассчитать биты, которые хранятся. Но опять же я не уверен, что больше, что я не могу измерить себя.

Answer 1

Я не нашел универсального способа, чтобы получить оставшийся предел на браузерах, которые мне нужны, но я узнал, что когда вы достигнете пределы, появляется сообщение об ошибке, которое всплывает. Это курс отличается в каждом браузере.

Максимум этому я использовал этот маленький скрипт:

for (var i = 0, data = "m"; i < 40; i++) {
    try { 
        localStorage.setItem("DATA", data);
        data = data + data;
    } catch(e) {
        var storageSize = Math.round(JSON.stringify(localStorage).length / 1024);
        console.log("LIMIT REACHED: (" + i + ") " + storageSize + "K");
        console.log(e);
        break;
    }
}
localStorage.removeItem("DATA");

Из этого я получил эту информацию:

Гугл Хром

• Domexception:
  • Код: 22.
  • Сообщение: «Не удалось выполнить« setiTem »на« хранилище »: установка значения« данных »превысило квоту».
  • Название: «QuotaexechedError»

Mozilla Firefox.

• Domexception:
  • Код: 1014.
  • Сообщение: «Устойчивый максимальный размер хранения достигнут»
  • Имя: "ns_error_dom_quota_reached"

Сафари

• Domexception:
  • Код: 22.
  • Сообщение: «QualtaeexeeceCheEmerRor: DOM Исключение 22»
  • Название: «QuotaexechedError»

Internet Explorer, Edge (сообщество)

• Domexception:
  • Код: 22.
  • Сообщение: «QuoteexeexeCheError»
  • Название: «QuotaexechedError»

---

Мое решение

До сих пор мое решение - добавить дополнительный вызов каждый раз, когда пользователь сэкономит бы ничего. И если исключение поймано, то я бы сказал им, что у них не хватает емкости хранения.

---

Редактировать: Удалить добавленные данные

Я забыл упомянуть, что для этого на самом деле работать, вам нужно будет удалить DATA предмет, который был установлен изначально. Изменение отражено выше, используя Убрать предмет() функция.

Answer 2

Вы можете получить приблизительную идею, используя методы JSON, чтобы повернуть весь объект LocalStorage к строке JSON:

JSON.stringify(localStorage).length

Я не знаю, как это будет байт, особенно с несколькими байтами добавленной разметки, если вы используете дополнительные объекты - но я полагаю, что это лучше, чем думать, что вы только нажимаете 28К и вместо этого. Верса).

Answer 3

IE8 реализует remainingSpace Недвижимость для этой цели:

alert(window.localStorage.remainingSpace);  // should return 5000000 when empty

К сожалению, кажется, что это не доступно в других браузерах. Однако я не уверен, что они реализуют что-то подобное.

Answer 4

Вы можете использовать линию ниже, чтобы точно рассчитать это значение и Вот jsfiddle Для иллюстрации его использования

alert(1024 * 1024 * 5 - escape(encodeURIComponent(JSON.stringify(localStorage))).length);

Answer 5

На сегодняшний день столкнулся с этим во время тестирования (превышение квоты хранения) и взбито решение. ИМО, зная, какой предел и где мы находимся в отношении, намного менее ценно, чем реализация функционального способа, чтобы продолжить хранение за пределами квоты.

Таким образом, вместо того, чтобы пытаться делать сравнения размера и проверки емкости, давайте реагируем, когда мы попали в квоту, уменьшите наше текущее хранилище на треть, и возобновить хранение. Если указанное сокращение не удается, прекратите хранение.

set: function( param, val ) { 
    try{
        localStorage.setItem( param, typeof value == 'object' ? JSON.stringify(value) : value )
        localStorage.setItem( 'lastStore', new Date().getTime() )
    }
    catch(e){
      if( e.code === 22 ){
        // we've hit our local storage limit! lets remove 1/3rd of the entries (hopefully chronologically)
        // and try again... If we fail to remove entries, lets silently give up
        console.log('Local storage capacity reached.')

        var maxLength = localStorage.length
          , reduceBy = ~~(maxLength / 3);

        for( var i = 0; i < reduceBy; i++ ){
          if( localStorage.key(0) ){
            localStorage.removeItem( localStorage.key(0) );
          }
          else break;
        }

        if( localStorage.length < maxLength ){
          console.log('Cache data reduced to fit new entries. (' + maxLength + ' => ' + localStorage.length + ')');
          public.set( param, value );
        }
        else {
          console.log('Could not reduce cache size. Removing session cache setting from this instance.');
          public.set = function(){}
        }
      }
    }
}

Эта функция живет в объекте обертки, поэтому публично. Комбратная связь просто звонит. Теперь мы можем добавить в хранилище и не беспокоить то, что такое квота или насколько близко мы тоже. Если один магазин превышает 1/3, размер квоты - это то, где эта функция перестанет бронировать и бросить хранение, а в этот момент вы не должны кэшировать в любом случае, верно?

Answer 6

Чтобы добавить в результаты теста браузера:

Fire FoxI = 22.

СафариВерсия 5.0.4 На моем Mac не повесила. Ошибка как Chrome. I = 21.

ОпераСообщает пользователю, что веб-сайт хочет хранить данные, но не имеет достаточно места. Пользователь может отклонить запрос, до предела требуемой суммы или нескольким другим ограничениям, либо устанавливать его в неограниченное значение. Перейти в Opera: WebStorage, чтобы сказать, появится ли это сообщение или нет. I = 20. Ошибка брошена такая же, как Chrome.

IE9 стандарты режимаОшибка как Chrome. I = 22.

IE9 в режиме стандартов IE8Сообщение консоли «Ошибка: Недостаточно памяти доступно для завершения этой операции». I = 22.

IE9 в более старых режимахОшибка объекта. I = 22.

IE8.У вас нет копирования для тестирования, но локальное хранилище поддерживается (http://stackoverflow.com/questions/3452816/does-ie8-support-out-of-te-box-in-localstorage)

IE7 и нижеНе поддерживает локальное хранилище.

Answer 7

Вы можете проверить свой браузер с этим Тест поддержки веб-хранилища

Я проверен Fire Fox на моем ноутбуке Android-планшета и ноутбука Windows и Хромизм Просто в результатах окон:

1. Fire Fox(Windows):

   • локальная табличка: 5120K Char.
   • SessionStorage.: 5120K Char.
   • локальная табличка: *не поддерживается

2. Fire Fox(Android):

   • локальная табличка: 2560k Char.
   • SessionStorage.: Неограниченный (точно тестовый прогон до 10240K Char == 20480K байт)
   • локальная табличка: не поддерживается

3. Хромизм(Windows):

   • локальная табличка: 5120K Char.
   • SessionStorage.: 5120K Char.
   • локальная табличка: не поддерживается

Обновлять

На Google Chrome версии 52.0.2743.116 м (64-битные) ограничения, где немного ниже 5101k персонажи. Это означает, что Max доступно может измениться в версиях.

Answer 8

Хотел бы я добавить это в комментарий - не достаточно повтора, извините.

Я провел несколько проверок.

http://jsperf.com/occupied-localstorage-json-stringify-length

Это действительно так - около 50 раз дороже, чем отслеживать то, что вы храните, и ухудшается, становится все более Fuller LocalStorage.

Answer 9

Эта функция получает точный Хранение доступно / слева:

Я сделал набор полезных функций для LocalStorage *здесь*

http://jsfiddle.net/kzq6jgqa/3/

function getLeftStorageSize() {
    var itemBackup = localStorage.getItem("");
    var increase = true;
    var data = "1";
    var totalData = "";
    var trytotalData = "";
    while (true) {
        try {
            trytotalData = totalData + data;
            localStorage.setItem("", trytotalData);
            totalData = trytotalData;
            if (increase) data += data;
        } catch (e) {
            if (data.length < 2) break;
            increase = false;
            data = data.substr(data.length / 2);
        }
    }
    localStorage.setItem("", itemBackup);

    return totalData.length;
}

// Examples
document.write("calculating..");
var storageLeft = getLeftStorageSize();
console.log(storageLeft);
document.write(storageLeft + "");

// to get the maximum possible *clear* the storage 
localStorage.clear();
var storageMax = getLeftStorageSize();

Обратите внимание, что это не очень быстро, поэтому не используйте его все время.

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

Максимальное хранилище я получил - все около 5 м:

• 5000000 Chars - Edge
• 5242880 Chars - Chrome
• 5242880 Chars - Firefox
• 5000000 символов - то есть

Вы найдете несколько комментарий в скрипле, чтобы увидеть прогресс в консоли.

Взял меня некоторое время, чтобы сделать, надеюсь, это поможет ☺

Answer 10

Мне нужно было фактически имитировать и тестировать, что будет делать мой модуль, когда хранение заполнено, поэтому мне нужно было получить тесную точность, когда хранилище заполнено, а не принятый ответ, который теряет точность со скоростью I ^ 2.

Вот мой скрипт, который всегда должен производить точность 10 включенного, когда крышка памяти достигается, и довольно быстро, несмотря на некоторые легкие оптимизации ... Редактировать: Я сделал скрипт лучше и с точной точностью:

function fillStorage() {
    var originalStr = "1010101010";
    var unfold = function(str, times) {
        for(var i = 0; i < times; i++)
            str += str;
        return str;
    }
    var fold = function(str, times) {
        for(var i = 0; i < times; i++) {
            var mid = str.length/2;
            str = str.substr(0, mid);
        }
        return str;
    }

    var runningStr = originalStr;
    localStorage.setItem("filler", runningStr);
    while(true) {
        try {
            runningStr = unfold(runningStr, 1);
            console.log("unfolded str: ", runningStr.length)
            localStorage.setItem("filler", runningStr);
        } catch (err) {
            break;
        }
    }

    runningStr = fold(runningStr, 1);  
    var linearFill = function (str1) {
        localStorage.setItem("filler", localStorage.getItem("filler") + str1);
    }
    //keep linear filling until running string is no more...
    while(true) {
        try {
            linearFill(runningStr)
        } catch (err) {
            runningStr = fold(runningStr, 1);
            console.log("folded str: ", runningStr.length)
            if(runningStr.length == 0)
                break;
        }
    }

    console.log("Final length: ", JSON.stringify(localStorage).length)
}

Answer 11

Это может помочь кому-то. В Chrome можно попросить пользователя позволить использовать больше дискового пространства, если это необходимо:

// Request Quota (only for File System API)  
window.webkitStorageInfo.requestQuota(PERSISTENT, 1024*1024, function(grantedBytes) {
  window.webkitRequestFileSystem(PERSISTENT, grantedBytes, onInitFs, errorHandler); 
}, function(e) {
  console.log('Error', e); 
});

Посещение https://developers.google.com/chrome/WhitePapers/Storage#asking_More. для получения дополнительной информации.

Answer 12

 try {
     var count = 100;
     var message = "LocalStorageIsNOTFull";
     for (var i = 0; i <= count; count + 250) {
         message += message;
         localStorage.setItem("stringData", message);
         console.log(localStorage);
         console.log(count);
     }

 }
 catch (e) {
     console.log("Local Storage is full, Please empty data");
     // fires When localstorage gets full
     // you can handle error here ot emply the local storage
 }