Daten in Webseiten bewahren

Die Übergabe von Daten zwischen HTML-Seiten mithilfe von Abfrageparametern wirft das Problem der Datensichtbarkeit in der URL auf. Glücklicherweise gibt es in JavaScript und jQuery alternative Mechanismen für die seitenübergreifende Übermittlung von Daten.

HTML5-Speicherobjekte nutzen

Um dieses Problem zu lösen, stellt HTML5 Speicherobjekte wie sessionStorage und bereit lokaler Speicher. Diese Objekte bieten eine Möglichkeit, Daten vorübergehend oder dauerhaft im lokalen Speicher des Browsers zu speichern und so einen späteren bequemen Abruf zu ermöglichen.

Sitzungsspeicherung

Zur temporären Datenspeicherung innerhalb eines Für eine einzelne Browsersitzung ist sessionStorage ideal. Auf die in sessionStorage gespeicherten Daten kann bis zum Ende der Sitzung zugegriffen werden (z. B. wenn der Browser-Tab geschlossen wird).

sessionStorage.setItem('label', 'value');
sessionStorage.getItem('label');

Lokaler Speicher

Für eine dauerhaftere Speicherung ist localStorage die Lösung. In localStorage gespeicherte Daten bleiben auch dann bestehen, wenn der Browser geschlossen und erneut geöffnet wird.

localStorage.setItem('label', 'value');
localStorage.getItem('label');

Vorteile von HTML5-Speicherobjekten

• Daten bleiben verborgen, sodass Bedenken hinsichtlich der Sichtbarkeit in der URL vermieden werden.
• Gespeicherte Werte bleiben über mehrere Seiten hinweg und auch nach Browser-Aktualisierungen bestehen (für localStorage).
• Ideal zum Speichern von Zwischenformulardaten oder anderen wichtigen Informationen, die zwischen Seiten geteilt werden müssen.