Die Berechnung Verwendung von localstorage Raum

StackOverflow https://stackoverflow.com/questions/3027142

Frage

Ich erstelle eine App des Bespin-Editor und HTML5 der localstorage verwenden. Es speichert alle Dateien lokal und hilft bei der Grammatik verwendet JSLint und einige andere Parser für CSS und HTML um den Benutzer zu unterstützen.

Ich möchte berechnen, wie viel von der Grenze localstorage verwendet worden ist und wie viel es tatsächlich ist. Ist das heute möglich? Ich dachte für nicht, einfach die Bits zu berechnen, die gespeichert werden. Aber dann wieder bin ich nicht sicher, was mehr ist dort, dass ich mich nicht messen kann.

War es hilfreich?

Lösung 2

Ich habe nicht einen universellen Weg finden, die verbleibenden Grenze auf den Browser zu bekommen ich brauchte, aber ich habe erfahren, dass, wenn Sie die Grenze tun erreichen gibt es eine Fehlermeldung, das erscheint. Dies ist-natürlich anders in jedem Browser.

Um max it out ich dieses kleine Skript verwendet: 

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

Von diesem Ich habe diese Informationen:

Google Chrome

  • DOMException:
    • Code: 22
    • Meldung: „Fehler beim Ausführen‚setItem‘auf‚Speicher‘. Wenn Sie den Wert von‚Daten‘die Quote überschritten“
    • Name: "QuotaExceededError"

Mozilla Firefox

  • DOMException:
    • Code: 1014
    • Meldung: "Persistent Storage maximale Größe erreicht"
    • Name: "NS_ERROR_DOM_QUOTA_REACHED"

Safari

  • DOMException:
    • Code: 22
    • Meldung: "QuotaExceededError: DOM Exception 22"
    • Name: "QuotaExceededError"

Internet Explorer, Rand (Gemeinschaft)

  • DOMException:
    • Code: 22
    • Meldung: "QuotaExceededError"
    • Name: "QuotaExceededError"

Meine Lösung

Bisher meine Lösung ist ein zusätzlicher Anruf jedes Mal hinzuzufügen, der Benutzer etwas retten würde. Und wenn die Ausnahme abgefangen wird, dann würde ich ihnen sagen, dass sie von Speicherkapazität ausgeführt werden.

Bearbeiten: Löschen Sie die hinzugefügten Daten

ich habe vergessen zu erwähnen, dass dies tatsächlich arbeiten Sie die DATA Artikel löschen müssten, die ursprünglich festgelegt wurde. Die Änderung wird reflektiert oben unter Verwendung der removeItem () Funktion.

Andere Tipps

Unter Umständen können Sie eine ungefähre Vorstellung davon bekommen, indem sie die JSON Methoden unter Verwendung das gesamte localstorage-Objekt in ein JSON-String zu machen: 

JSON.stringify(localStorage).length

Ich weiß nicht, wie Byte-genau, es wäre, vor allem mit den wenigen Bytes hinzugefügt Markup, wenn Sie zusätzliche Objekte verwenden - aber ich glaube, es ist besser als denken Sie 28K nur drängen und statt 280K tun ( oder umgekehrt).

IE8 implementiert die remainingSpace Eigenschaft für diesen Zweck: 

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

Leider scheint es, dass dies in den anderen Browsern nicht verfügbar. Allerdings bin ich nicht sicher, ob sie etwas ähnliches implementieren.

Sie können die folgende Zeile verwenden, um genau diesen Wert zu berechnen und hier ist ein jsfiddle zur Veranschaulichung seines Verwendung 

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

Ran in diesen heute beim Testen (über Speicherkontingent) und Schlag eine Lösung. IMO, zu wissen, was die Grenze ist und wo wir in Bezug sind, ist weit weniger wertvoll als eine funktionelle Art und Weise der Umsetzung über die Quote weiterhin zu speichern.

So anstatt zu versuchen, Größenvergleiche und Kapazitätsprüfungen zu tun, kann reagieren, wenn wir die Quote getroffen haben, ist unsere Stromspeicher um ein Drittel reduzieren und die Speicherung fortzusetzen. Wenn die Reduktion ausfällt, Stopp zu speichern. 

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(){}
        }
      }
    }
}

Diese Funktion lebt in einem Wrapper-Objekt, so public.set einfach nennt sich. Jetzt können wir den Speicher hinzufügen und sich keine Sorgen, was die Quote ist oder wie nahe sind wir zu ihm. Wenn ein einzelner Speicher von mehr als 1 / 3. die Kontingentgröße ist, wo diese Funktion Culling stoppt und beenden speichern, und an diesem Punkt sollten Sie sowieso nicht werden das Caching, nicht wahr?

Um den Browser Testergebnis:

Firefox i = 22.

Safari Version 5.0.4 auf meinem Mac habe hängen nicht. Fehler wie Chrome. i = 21.

Oper Teilt den Benutzer, dass die Website, Daten zu speichern will, aber nicht genügend Platz hat. Der Benutzer kann die Anforderung, bis die Grenze für die erforderliche Menge abzulehnen oder zu mehreren anderen Grenzen, oder es unbegrenzt eingestellt. Zum Oper: WebStorage sagen, ob diese Meldung angezeigt wird oder nicht. i = 20. Fehler ausgelöst ist die gleiche wie Chrome.

IE9-Standards-Modus Fehler wie Chrome. i = 22.

IE9 in IE8-Standards-Modus Konsolenmeldung „Fehler: Nicht genügend Speicher verfügbar, um diesen Vorgang abzuschließen“. i = 22

IE9 bei älteren Modi Objektfehler. i = 22.

IE8 Verwenden Sie keine Kopie zu testen, aber die lokale Speicherung wird unterstützt (http://stackoverflow.com/questions/3452816/does-ie8-support-out-of-the-box-in-localstorage)

IE7 und unter Nicht lokale Speicher unterstützen.

Sie können Ihren Browser testen mit diesem Webspeicher Unterstützung Test

I getestet Firefox auf meine beiden Android-Tablet und Windows-Laptop und Chromium nur auf windows Ergebnisse:

  1. Firefox (Windows):

    • local : 5120k char
    • session : 5120k char
    • local : * nicht unterstützt

  2. Firefox (Android):

    • local : 2560k char
    • session : Unlimited (genau Test läuft an 10240k char == 20480k Byte)
    • local : nicht unterstützt

  3. Chromium (Windows):

    • local : 5120k char
    • session : 5120k char
    • local : nicht unterstützt

Update

Auf Google Chrome Version 52.0.2743.116 m (64-Bit) Grenzen, wo ein wenig auf 5101k Zeichen senken. Diese Mittel max verfügbar sind, können in den Versionen ändern.

wünschte, ich könnte dieses Add in einem Kommentar -. Nicht genug rep, sorry

lief ich einige perf Tests - erwartet JSON.stringify (local) .length eine teuere op bei großem local Belegung zu sein.

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

Es ist in der Tat so - etwa 50x teurer als die Verfolgung der, was Sie speichern und wird noch schlimmer, desto voller wird local

.

Diese Funktion ruft die genau Lagerung verfügbar / links:

habe ich eine Reihe von nützlichen Funktionen für local * hier *

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

Hinweis, dass dies nicht sehr schnell, so kann es nicht die ganze Zeit.

Damit ich auch herausgefunden, dass. Die Artikel-Bezeichnung wird so viel Platz wie seine Länge aufzunehmen, die Artikel-Wert wird auch so viel Platz wie ihre Länge aufnehmen

Die maximale Lager Ich habe - alles über 5M:

  • 5000000 Zeichen - Kante
  • 5242880 Zeichen - Chrome
  • 5242880 Zeichen - Firefox
  • 5000000 Zeichen - IE

Sie werden einige out-kommentierten Code in der Geige finden die Fortschritte in der Konsole zu sehen.

Habe mir einige Zeit zu machen, hofft, das hilft ?

Ich musste tatsächlich simulieren und zu testen, was mein Modul tun wird, wenn Speicher voll ist, so dass ich auf eine enge Präzision erhalten erforderlich, wenn der Speicher voll ist, anstatt die akzeptierte Antwort, die mit einer Geschwindigkeit von i, dass die Präzision verliert ^ 2.

Hier ist mein Skript, das ist immer eine Genauigkeit von 10 auf, wenn der Speicher Kappe erreicht produzieren sollte, und ziemlich schnell trotz einiger einfache Optimierungen mit ... EDIT: Ich habe das Skript besser und mit einer exakten Genauigkeit: 

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

Dies könnte helfen jemand. In Chrom ist möglich, den Benutzer zu fragen, damit mehr Speicherplatz verwenden, wenn erforderlich: 

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

Besuchen Sie https://developers.google.com/chrome/whitepapers/storage#asking_more für weitere Informationen. 

 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
 }
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top