Verwendung von localStorage - die Theorie

LocalStorage dient zur Offline-Speicherung von Daten im Browser und setzt einen modernen HTML5-fähigen Browser voraus. Der Vorteil von localStorage besteht u.a. darin, dass deutlich größere Datenmengen clientseitig gespeichert werden können, als z.B. mit Cookies. Die Datenmengen sind browserabhängig (z.B. bis 5MB im Firefox, 10MB im IE). Somit kann der Traffic zwischen Server und Client signifikant verringert werden. Dies ist besonders im Umfeld von mobilen Webapplikationen bzw. mobilen Apps interessant. Es ist sogar möglich, z.B. Spiele komplett offline laufen zu lassen.

Sinnvoll einsetzbar ist LocalStorage z.B. für die Speicherung von:

• Benutzerangaben für Login- oder Kontakt-Formulare
• Spielstände von Browsergames
• diverse Applikationseinstellungen
• einzelner Schritte eines Workflows
• für Warenkorbfunktionalitäten

Eine weniger sinnvolle Anwendung ist das Tracken von Benutzerverhalten.

LocalStorage ist nicht zwingend an HTML5-Webseiten gebunden. Er kann auch mit HTML4-Webseiten verwendet werden. Allerdings wird ein moderner HTML5-fähiger Browser benötigt und der Benutzer muss selbstverständlich Javascript eingeschaltet haben. Insofern müssen Sie auch überlegen, inwieweit Sie zusätzliche Fallbacks vorhalten müssen.

Es wird generell zwischen dem permanenten localStorage und dem sessionStorage unterschieden. Wie der Name vermuten lässt, ist die Lebensdauer des sessionStorage auf die aktuelle Browsersession beschränkt, d.h. sobald der Browser geschlossen wird, sind auch die Daten aus dem sessionStorage gelöscht.

Welche Risiken bestehen in der Verwendung des localStorage?

Der Scope des localStorage ist die Domäne, d.h. http://www.domain.de/user1/ und http://www.domain.de/user2/ teilen sich den gleichen localStorage. Wenn man bedenkt, dass z.B. soziale Netzwerke üblicherweise mit der gleichen Domäne aufgerufen werden und sich nur über die Benutzer-Id oder einen Benutzernamen als Parameter oder Unterverzeichnis unterscheiden, kann man erahnen, was alles möglich sein kann, sofern ein Benutzer Schadcode einschleust. Insbesondere wenn solche Webseiten auf öffentlichen Rechnern aufgerufen werden, z.B. in Internet-Cafes. Dort hat man natürlich Zugriff auf den localStorage des vorherigen Benutzers (bei Aufruf der gleichen Domäne) und sofern man vergisst am Ende seiner Session den localStorage zu löschen, gilt dies natürlich auch für den nachfolgenden Benutzer. Das Löschen des localStorage ist browserabhängig. Meist wird mit Löschen der Cookies auch der localStorage gelöscht.

Dies beschreibt nur die Gefahren bei „normaler“ Verwendung einer Webapplikation. Durch eigeschleusten Schadcode oder XSS-Attacken kann dies natürlich noch eine ganz andere Dimension erhalten.

Aus Sicht des Entwicklers muss man natürlich auch Vorkehrungen treffen, um solche Situationen zu vermeiden. Sensitive Daten wie z.B. Passwörter sollten Sie generell nicht im localStorage speichern. Des Weiteren sollten Sie die Daten vor der Speicherung anhand eines eindeutigen Kriteriums verschlüsseln und sie vor der Verwendung wieder entschlüsseln, d.h. Sie sollten die Daten im localStorage nur verschlüsselt ablegen.

Fazit

Mit localStorage lässt sich sehr effektiv der Traffic zwischen Server und Client in modernen Webapplikationen verringern. Die Verwendung von localStorage birgt aber auch Risiken, die Sie bei der Entwicklung mit berücksichtigen sollten.

Soviel zur Theorie. Im Folgebeitrag werde ich Ihnen kurz die praktische Anwendung des localStorage an einem Beispiel erläutern.