Web Storage

Web Storage (auch DOM Storage) ist eine Technik für Webanwendungen, mit der Daten in einem Webbrowser gespeichert werden. DOM Storage unterstützt persistente Datenspeicherung, ähnlich Cookies, ebenso wie die lokale (Local Storage) und Session-spezifische Speicherung (Session Storage).

DOM Storage wird durch das World Wide Web Consortium (W3C) standardisiert. Ursprünglich war es Teil der HTML5-Spezifikation, wurde mittlerweile aber in eine eigene Spezifikation ausgegliedert.[1]

Merkmale

DOM Storage kann vereinfacht als eine Weiterentwicklung von Cookies („Super-Cookies“) angesehen werden. Die Technik bietet weitaus größere Speicherkapazität (5 MB pro Domain in Firefox[2], ca. 10 MB pro Storage Area im Internet Explorer[3]) und bessere Entwicklungsschnittstellen. In einigen Punkten unterscheidet sie sich jedoch von Cookies.

Client-seitige Schnittstelle

Im Gegensatz zu Cookies, auf die sowohl Server als auch Client zugreifen können, wird DOM Storage vollständig vom Client gesteuert. Es werden hierbei nicht mit jedem HTTP-Request Daten zum Server übertragen und ein Webserver kann auch nicht direkt Daten im DOM Storage schreiben. Der Zugriff erfolgt ausschließlich über Skripte auf der Webseite.

Speicherung

DOM Storage bietet zwei verschiedene Arten der Speicherung an: lokale (localStorage) und Session-spezifische (sessionStorage). Sie unterscheiden sich in Gültigkeitsbereich und -dauer.

Lokale Speicherung

Daten, die lokal gespeichert werden, sog. Local Shared Objects (LSO), sind mit einer Domain und dem lokalen Benutzerprofil des Zugriffsrechners verknüpft und bleiben auch nach Beenden des Browsers bestehen. Alle Skripte einer Domain, von der aus die Daten gespeichert wurden, können auf die benutzerprofilspezifischen Daten zugreifen.

Bei Mozilla Firefox werden die Daten in der Datenbankdatei webappsstore.sqlite gespeichert. Mit einem geeigneten Programm kann die SQLite3-Datei betrachtet werden. Es existieren Browser-Addons, die zu dem Zweck entstanden sind, diese Daten vom System wieder löschen zu lassen, auch automatisiert, z. B. mit Better Privacy. Über die Eingabe von „about:config“ in der Adresszeile kann der Wert von dom.storage.enabled von true zu false geändert, und DOM-Storage-Objekte somit abgeschaltet werden.

Session-spezifische Speicherung

Session-spezifisch gespeicherte Daten sind mit dem Browser-Fenster verknüpft und auf dieses beschränkt. Gespeicherte Daten werden beim Schließen des Browser-Fensters gelöscht. Diese Technik bietet die Möglichkeit, mehrere Instanzen derselben Anwendung in verschiedenen Fenstern laufen zu lassen, ohne dass es zu einer gegenseitigen Beeinflussung kommt, was von Cookies nicht unterstützt wird.[4]

Datenmodell

DOM Storage speichert Daten in einem assoziativen Array, in dem die Schlüssel und Werte Strings sind. Über eine zusätzliche Programmierschnittstelle zum Zugriff auf strukturierte Daten, möglicherweise auf SQL-Basis, wird derzeit innerhalb der Web Applications Working Group des W3C diskutiert.[5]

Verwendung

Daten können mit den Funktionen setItem und getItem gespeichert und wieder ausgelesen werden.

localStorage

// Speichert ein Key-Value-Paar im localStorage
// Die Daten können auch nach einem Neustart des Browsers ausgelesen werden
localStorage.setItem('key', 'value');

// Liest den eben gespeicherten Wert aus und zeigt ihn an
alert(localStorage.getItem('key')); // value

sessionStorage

// Speichert ein Key-Value-Paar im sessionStorage
// Die Daten werden nach dem Schließen des Browsers gelöscht
sessionStorage.setItem('key', 'value');

// Liest den eben gespeicherten Wert aus und zeigt ihn an
alert(sessionStorage.getItem('key')); // value

Speichern von JSON-Objekten

In Web Storages können nur Strings gespeichert werden. Möchte jedoch ein JSON-Objekt gespeichert werden, muss dieses vor dem Speichern in einen String konvertiert werden. Beim Auslesen kann es dann wieder in ein JSON-Objekt zurückkonvertiert werden.

localStorage.setItem('key', JSON.stringify({firstname: 'Peter', lastname: 'Meier'}));

alert(JSON.parse(localStorage.getItem('key')).firstname); // Peter

Browser-Unterstützung

Web Storage wird von folgenden Browsern unterstützt:[6]

Browserab Version
Google Chrome4
Mozilla Firefox3.5[7]
Opera10.5
Internet Explorer8
Edge12
Apple Safari4
iOS3.2
Android2.1

Ähnliche Technologien

Weblinks

  • W3C: Web Storage
  • Web-Tracking-Report 2014 Fraunhofer-Institut für Sichere Informationstechnologie SIT Markus Schneider, Matthias Enzmann, Martin Stopczynski, Hrsg. Michael Waidner Fraunhofer Verlag PDF 118 Seiten ISBN 978-3-8396-0700-8

Einzelnachweise

  1. ↑ Web Storage Spezifikation des W3C (World Wide Web Consortium)
  2. ↑ John Resig: DOM Storage
  3. ↑ Introduction to Web Storage. Microsoft, 20. Oktober 2006, abgerufen am 1. Juli 2019 (englisch).
  4. ↑ W3C: Web Storage draft standard
  5. ↑ W3C: Web Storage draft standard
  6. ↑ http://www.html5rocks.com/en/features/storage
  7. ↑ https://developer.mozilla.org/de/docs/Web/API/Window/localStorage