Einführung in Webspeicher

Die Webspeicher-API umfasst zwei verwandte Mechanismen zum Beibehalten von clientseitigen Daten auf sichere Weise, die das Dokumentobjektmodell (DOM) verwenden: sessionStorage und localStorage. Diese Objekte wurden in Internet Explorer 8 eingeführt.

Hinweis  Bei früheren Versionen von Internet Explorer wurde das Speichern beständiger Daten durch das Verhalten userData implementiert.

Was ist Webspeicher?

Webspeicher wird oft mit HTTP-Cookies verglichen. Ähnlich wie Cookies können Webentwickler sitzungsabhängige oder domänenspezifische Daten mithilfe von Webspeicher als Name-Wert-Paare auf dem Client speichern. Im Gegensatz zu Cookies gestaltet der Webspeicher jedoch die Steuerung einfacher, wie von einem Fenster gespeicherte Informationen für ein anderes Fenster sichtbar sind.

Ein Benutzer könnte z. B. zwei Browserfenster öffnen, um Flugtickets für zwei verschiedene Flüge zu kaufen. Wenn die Webanwendung der Fluggesellschaft ihren Sitzungsstatus jedoch mithilfe von Cookies speichert, könnten Informationen von einer Transaktion in die andere "durchsickern" und den Benutzer potenziell veranlassen, zwei Tickets für den gleichen Flug zu kaufen, ohne es zu bemerken. Da sich Anwendungen hinsichtlich der Offlineverhaltensweisen kompetenter verhalten, z. B. das lokale Speichern von Werten für die spätere Rückkehr zum Server, wird das Potenzial für diese Art des "Informationsverlusts" vorherrschender.

Webspeicher DOM-Storage bietet auch bedeutend mehr Speicherplatz als Cookies. In Internet Explorer können Cookies nur 4 Kilobyte (KB) Daten speichern. Dieser Gesamtwert kann aus einem Name-Wert-Paar von 4 KB oder aus bis zu 20 Name-Wert-Paaren bestehen, die eine Gesamtgröße von 4 KB besitzen. Im Vergleich stellt der Webspeicher ungefähr 10 Megabyte (MB) für jeden Speicherbereich bereit.

Funktionell unterscheiden sich Clientspeicherbereiche von Cookies. Webspeicher sendet weder mit jeder Anforderung Werte zum Server, wie es bei Cookies der Fall ist, noch laufen die Daten in einem lokalen Speicherbereich jemals ab. Und im Gegensatz zu Cookies ist es einfach, mithilfe einer Standardschnittstelle, die wachsende Unterstützung durch Browseranbieter erfährt, auf einzelne Daten zuzugreifen.

Webspeicher-Skriptobjekte

window.sessionStorage

Sitzungsspeicher ist für Szenarios gedacht, in denen der Benutzer eine einzelne Transaktion ausführt. Das sessionStorage-Attribut des window-Objekts bewahrt Schlüssel-Wert-Paare für alle Seiten, die während der Gültigkeitsdauer einer einzelnen Registerkarte geladen werden (für die Dauer des Browserkontexts der obersten Ebene). Eine Seite könnte z. B. ein Kontrollkästchen enthalten, das der Benutzer aktiviert, um den Wunsch nach einer Versicherung anzugeben.


<label>
    <input type="checkbox" onchange="sessionStorage.insurance = checked">
    I want insurance on this trip.
</label>

Eine nachfolgende Seite könnte dann per Skript überprüfen, ob der Benutzer das Kontrollkästchen aktiviert hat.


if (sessionStorage.insurance) { ... } 

Das Storage-Objekt unterstützt Expando-Eigenschaften ('insurance' (Versicherung) im vorangehenden Beispiel). Wenn der Eigenschaftenname nicht vorhanden ist, wird automatisch ein Schlüssel-Wert-Paar erstellt, um ihn automatisch aufzunehmen. Beachten Sie, dass Schlüssel-Wert-Paare immer als Zeichenfolgen gespeichert werden. Andere Datentypen, z. B. Zahlen, boolesche Werte und strukturierte Daten, müssen vor dem Fortbestehen in einem Speicherbereich in Zeichenfolgen konvertiert werden.

Nachdem ein Wert in sessionStorage gespeichert wurde, kann er von einem Skript abgerufen werden, das auf einer anderen Seite im gleichen Kontext ausgeführt wird. Wenn ein anderes Dokument geladen wird, wird sessionStorage aus dem Arbeitsspeicher für URLs gleichen Ursprungs initialisiert. (Weitere Informationen finden Sie im Abschnitt Sicherheit und Datenschutz.)

Hinweis  Obwohl es hinsichtlich HTML5 zulässig ist, setzt Internet Explorer 8 sessionStorage nach der Browserwiederherstellung nach einem Systemabsturz nicht fort.

window.localStorage

Der lokale Speichermechanismus umfasst mehrere Fenster und bleibt über die aktuelle Sitzung hinaus erhalten. Das localStorage-Attribut stellt beständige Speicherbereiche für Domänen bereit. Es ermöglicht es Webanwendungen, beinahe 10 MB an Benutzerdaten aus Leistungsgründen auf dem Client zu speichern, z. B. ganze Dokumente oder das Postfach eines Benutzers.

Eine Website kann z. B. einen Zähler dafür anzeigen, wie oft der Benutzer eine Seite mit dem folgenden Skript besucht hat.


<p>
  You have viewed this page
  <span id="count">an untold number of</span>
  time(s).
</p>
<script>
  var storage = window.localStorage;
  if (!storage.pageLoadCount) storage.pageLoadCount = 0;
  storage.pageLoadCount = parseInt(storage.pageLoadCount, 10) + 1;
  document.getElementById('count').innerHTML = storage.pageLoadCount;
</script> 

Hinweis  Vor dem Inkrementieren von "pageLoadCount" muss es zuerst mithilfe der parseInt-Methode (JScript 5.6) in eine Zahl konvertiert werden.

Jede Domäne und jede Unterdomäne verfügt über einen eigenen separaten lokalen Speicherbereich. Domänen können auf die Speicherbereiche von Unterdomänen zugreifen, und Unterdomänen können auf die Speicherbereiche von übergeordneten Domänen zugreifen. Auf localStorage['example.com'] kann z. B. über example.com und die zugehörigen Unterdomänen zugegriffen werden. Auf die Unterdomäne localStorage['www.example.com'] kann über example.com zugegriffen werden, aber nicht über andere Unterdomänen wie z. B mail.example.com.

Das Storage-Objekt

Die folgenden Eigenschaften und Methoden werden von Sitzungs- und lokalen Speicherobjekten unterstützt.

ThemaInhalt
clear

Entfernt alle Schlüssel-Wert-Paare aus dem Webspeicherbereich.

constructor

Gibt einen Verweis auf den Konstruktor eines Objekts zurück.

getItem

Ruft den dem Webspeicherschlüssel zugeordneten aktuellen Wert ab.

key

Ruft den Schlüssel beim angegebenen Index in der Sammlung ab.

length

Ruft die Länge der Schlüssel-Wert-Liste ab.

remainingSpace

Ruft den für das Storage-Objekt verbleibenden Speicherbereich ab, in Bytes.

removeItem

Löscht ein Schlüssel-Wert-Paar aus der Webspeichersammlung.

setItem

Legt ein Schlüssel-Wert-Paar fest.

 

Webspeicherereignisse

Internet Explorer löst Ereignisse aus, wenn Daten in einem Speicherbereich aktualisiert werden, damit Informationen zwischen mehreren Instanzen des Browsers oder Registerkarten synchronisiert werden können.

Folgende Ereignisse werden unterstützt.

onstorage

Das onstorage-Ereignis wird in einem document ausgelöst, wenn ein Speicherbereich geändert wird. Alle Dokumente, die denselben Sitzungskontext nutzen, und die Dokumente, die momentan eine Seite von derselben Domäne oder Unterdomäne anzeigen, in der lokaler Speicher eingesetzt wird, empfangen das Ereignis.

Wenn das document-Zielobjekt gerade nicht aktiv ist, löst Internet Explorer keine Ereignisse aus.

onstoragecommit

Internet Explorer speichert lokalen Speicher mithilfe von XML-Dateien. Das onstoragecommit-Ereignis wird ausgelöst, wenn ein lokaler Speicher auf Datenträger geschrieben wird.

Sicherheit und Datenschutz

Die in lokalem Speicher gespeicherten Daten sind viel öffentlicher als die in Cookies gespeicherten Daten, die auf einen bestimmten Pfad innerhalb einer Domäne beschränkt sein können. Selbst das Auswählen eines schwer zu erratenden Schlüssels bietet keinen Datenschutz, da das Storage-Objekt eine Möglichkeit bereitstellt, diesen aufzulisten.

Folgende Informationen sollten berücksichtigt werden:

Browserkontext der obersten Ebene und Ursprung

Der Zugriff auf den Sitzungsspeicherbereich wird durch den Browserkontext der obersten Ebene eingeschränkt. In Internet Explorer wird für jede Registerkarte ein neuer Browserkontext erstellt. Ein im Browserkontext der obersten Ebene ausgeführtes Skript erhält keinen Zugriff auf einen Speicherbereich, der in einem anderen Kontext erstellt wurde. Websites können dem Sitzungsspeicher Daten hinzufügen, auf den beliebige Seiten des zugehörigen Hostnamens zugreifen können, die im gleichen Fenster geöffnet wurden.

Wichtig  Der Port und das Protokoll/Schema werden im Rahmen dieser Überprüfung nicht ausgewertet.

Ursprung bestimmt Speichergrenzen

Datenträgerkontingentgrenzen werden der Domäne der Seite auferlegt, die den Wert festlegt, anstatt der Domäne, in der der Wert festgelegt wird. Dies verhindert, dass bösartige Skripts das Speicherkontingent einer verwandten Domäne verbrauchen. Es verhindert auch, dass derartige Skripts mithilfe zufälliger Unterdomänen uneingeschränkte Datenmengen speichern.

Die Speichergröße wird als Gesamtlänge aller Schlüsselnamen und Werte berechnet, und ein einzelner Speicherbereich kann bis zu 10 Millionen Bytes enthalten. Die remainingSpace-Eigenschaft bestimmt den verfügbaren Speicherbereich.

Löschen der Speicherbereiche

Der Sitzungszustand wird freigegeben, sobald das letzte Fenster geschlossen wird, das auf diese Daten verweist. Benutzer können Speicherbereiche jedoch jederzeit löschen, indem sie in Internet Explorer im Menü Extras auf Browserverlauf löschen klicken, anschließend das Kontrollkästchen Cookies aktivieren und dann auf OK klicken. Dadurch werden Sitzungs- und lokale Speicherbereiche für alle Domänen gelöscht, die nicht im Ordner "Favoriten" enthalten sind, und die Speicherkontingente in der Registrierung werden zurückgesetzt. Deaktivieren Sie das Kontrollkästchen Bevorzugte Websitedaten beibehalten, um alle Speicherbereiche unabhängig von der Quelle zu löschen.

Wenn Sie Schlüssel-Wert-Paare aus einer Speicherliste löschen möchten, durchlaufen Sie die Sammlung mit removeItem oder verwenden Sie clear, um alle Elemente gleichzeitig zu löschen. Denken Sie daran, dass Änderungen an einem lokalen Speicherbereich auf dem Datenträger asynchron gespeichert werden.

API-Referenz

Web Storage

Beispiele und Lernprogramme

Lokales Speichern von Dateien mithilfe des Webspeichers

Demos für die Internet Explorer-Testversion

Offline-Rechner

IEBlog-Beiträge

Erstellen von Websites und Apps für die Offlineverwendung mit den HTML5-Features AppCache und IndexedDB

Spezifikation

Webspeicher

Verwandte Themen

Eine kurze Übersicht über JSON
Clientseitige Verwendung des Webspeichers
Schreiben einer datenzentrisch orientierten Webanwendung mithilfe des lokalen HTML5-Speichers

 

 

Anzeigen:
© 2014 Microsoft