Web Storage

Technik für Webanwendungen zur Speicherung von Daten im Webbrowser

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 Bearbeiten

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 Bearbeiten

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 Bearbeiten

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 Bearbeiten

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 Bearbeiten

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 Bearbeiten

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 Bearbeiten

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

localStorage Bearbeiten

// 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 Bearbeiten

// 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 Bearbeiten

In Web Storages können nur Strings gespeichert werden. Soll 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 Bearbeiten

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

Browser ab Version
Google Chrome 4
Mozilla Firefox 3.5[7]
Opera 10.5
Internet Explorer 8
Edge 12
Apple Safari 4
iOS 3.2
Android 2.1

Datenschutz und Privatsphäre Bearbeiten

Die insbesondere dauerhafte Hinterlegung von Schlüsselwerten ermöglicht jeder Website, wiederkehrende Besuche vom selben Endgerät zu erkennen und unterschiedliche Nutzungsprofile zusammenzuführen.

Ähnliche Technologien Bearbeiten

Literatur Bearbeiten

Weblinks Bearbeiten

Einzelnachweise Bearbeiten

  1. Web Storage Spezifikation. 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. Web Storage draft standard. (Memento des Originals vom 1. Februar 2011 im Internet Archive)  Info: Der Archivlink wurde automatisch eingesetzt und noch nicht geprüft. Bitte prüfe Original- und Archivlink gemäß Anleitung und entferne dann diesen Hinweis.@1@2Vorlage:Webachiv/IABot/dev.w3.org W3C.
  5. Web Storage draft standard. (Memento des Originals vom 1. Februar 2011 im Internet Archive)  Info: Der Archivlink wurde automatisch eingesetzt und noch nicht geprüft. Bitte prüfe Original- und Archivlink gemäß Anleitung und entferne dann diesen Hinweis.@1@2Vorlage:Webachiv/IABot/dev.w3.org W3C.
  6. html5rocks.com
  7. developer.mozilla.org