Web Storage: Überblick
Local Storage und Session Storage bieten beide eine einfache und effiziente Lösung für die clientseitige Datenspeicherung.
- Local Storage ermöglicht das dauerhafte Speichern von Daten über Browser-Sitzungen hinweg, ideal für die Aufbewahrung von Benutzereinstellungen und -präferenzen.
- Session Storage bietet eine temporäre Speicherlösung für Daten, die nur während einer einzelnen Browser-Sitzung relevant sind, wie die Inhalte eines Einkaufswagens.
Funktionsweise von Web Storage
Die Verwendung von Web Storage ist einfach und erfolgt über JavaScript-Schnittstellen. Daten werden in Schlüssel-Wert-Paaren gespeichert und können mit der Web Storage API gesetzt, abgerufen und gelöscht werden. Diese Schnittstellen bieten Methoden wie setItem(), getItem() und removeItem() zur Manipulation der gespeicherten Daten.
Speichern von Daten
Um Daten in Local Storage oder Session Storage zu speichern, verwendet man die setItem()-Methode:
localStorage.setItem('schluessel', 'wert');
sessionStorage.setItem('schluessel', 'wert');Abrufen von Daten
Daten können mit der getItem()-Methode abgerufen werden:
var wert = localStorage.getItem('schluessel');
var wert = sessionStorage.getItem('schluessel');Löschen von Daten
Einzelne Datenpunkte können mit der removeItem()-Methode gelöscht werden, während die clear()-Methode den gesamten Speicherbereich leert:
localStorage.removeItem('schluessel');
localStorage.clear();
sessionStorage.removeItem('schluessel');
sessionStorage.clear();Einsatzgebiete von Web Storage
Web Storage wird häufig für folgende Zwecke verwendet:
- Speichern von Benutzereinstellungen und Anwendungszuständen
- Caching von Daten zur Verbesserung der Ladegeschwindigkeit und Performance
- Speichern von Formulardaten
Sicherheit und Einschränkungen von Web Storage
1. XSS-Angriffe (Cross-Site Scripting)
Web Storage ist anfällig für XSS-Angriffe, da bösartiger Code, der in eine Webseite injiziert wird, auf Local Storage oder Session Storage zugreifen und sensible Daten stehlen kann. Sensible Daten wie Sitzungs-IDs oder Zugangstoken sollten Sie deshalb nicht im Web Storage ablegen. Für Sitzungsdaten sind Cookies mit dem Attribut HttpOnly sicherer, da diese per JavaScript nicht auslesbar sind.
2. CSRF-Angriffe (Cross-Site Request Forgery)
Bei CSRF bringt eine fremde Seite den Browser dazu, Anfragen mit den automatisch mitgesendeten Cookies zu stellen. Inhalte aus Web Storage sendet der Browser nicht automatisch mit. Ein Token, das nur in Web Storage liegt, kann ein CSRF-Angriff deshalb nicht nutzen; per XSS ist es aber auslesbar.
3. Klartextspeicherung
Daten in Web Storage werden im Klartext gespeichert und sind nicht verschlüsselt, was ein Risiko darstellt, wenn sensible oder persönliche Informationen gespeichert werden.
4. Begrenzte Zugriffskontrolle
Jedes Skript, das auf einer Seite läuft, kann auf Local Storage und Session Storage ihres Ursprungs (Protokoll, Host und Port) zugreifen, auch eingebundene Skripte von Drittanbietern. Das erhöht die Datenanfälligkeit.
Technische Einschränkungen
1. Speicherkapazität
Die Größe des Web Storage ist begrenzt, in gängigen Browsern auf bis zu 5 MiB Local Storage und 5 MiB Session Storage pro Ursprung (Origin), was die Menge der speicherbaren Informationen einschränkt.
2. Fehlende Persistenz
Während Local Storage Daten dauerhaft speichert, behält Session Storage Daten nur während einer Browser-Sitzung. Auch Local Storage bleibt nicht in jedem Fall erhalten. Safari löscht bei aktiviertem Schutz vor websiteübergreifendem Tracking per Skript angelegte Daten einer Website, wenn es in den letzten sieben Tagen der Browsernutzung keine Interaktion mit ihr gab.
3. Fehlende Synchronisation zwischen Tabs und Fenstern
Daten, die in Session Storage gespeichert sind, sind nur im gleichen Tab verfügbar und können nicht zwischen verschiedenen Tabs oder Fenstern geteilt werden.
4. Plattform- und Browser-Unterschiede
Die Implementierung und Verfügbarkeit von Web Storage können je nach Browser und Plattform variieren.
5. Keine serverseitige Kommunikation
Web Storage ist rein clientseitig, was bedeutet, dass gespeicherte Daten nicht automatisch an den Server gesendet werden.
Web Storage richtig einsetzen
Local Storage und Session Storage sind wertvolle Komponenten der Web Storage API, die für viele Anwendungsfälle Vorteile gegenüber Cookies bieten. Sie ermöglichen eine effiziente Handhabung von Daten in Webanwendungen, da die gespeicherten Daten nicht automatisch mit jeder Anfrage an den Server gesendet werden. Weil Web Storage jedoch per JavaScript auslesbar ist, eignet es sich nicht für sensible Daten. Rechtlich gilt für Web Storage dasselbe wie für Cookies. Nach § 25 TDDDG brauchen das Speichern von Informationen im Browser und der Zugriff darauf eine Einwilligung, es sei denn, das ist unbedingt erforderlich, damit ein ausdrücklich gewünschter Dienst bereitgestellt werden kann.
