Web Engineering 1/Persistenz

Wiki-Quelltext dieser Seite.

{{Ziele|
* Serverseitig meist klassische DBMS (MySQL, MongoDB)
* Clientseitige Speicherung ist durch den Browser beschränkt
** Cookies: max 4 kByte (Name-Wert Zeichenkette)
** WebStorage: max 5 MByte (Name-Wert Objekte)
** IndexedDB: unbeschränkt (NoSQL, indiziert, Objekt-basiert)
|
* Lesen und schreiben von Cookies
* Umgang mit dem WebStorage Speicher
* Verwendung von Transaktionen mit IndexedDB 
|
* Der Name des zuletzt angemeldeten Benutzers wird beim Start der WebApp angezeigt
* Der aktuelle Zustand des Sudoku (inklusive Zeit) wird mittels WebStorage gespeichert und beim Start der WebApp wiederhergestellt
}}

==Cookies==
{|
|style="width: 22em;vertical-align:top;"|<html>
<iframe width="380" height="200" src="//jsfiddle.net/pw_we1/yzLeck32/embedded/js,html,result/" frameborder="0"></iframe>
</html>
|style="vertical-align:top;padding-left:1em;"|
* ''Probieren Sie das Beispiel aus und erklären Sie warum Ihr Wert nicht der einzige im Cookie ist''
* ''Bearbeiten Sie den Code und speichern Sie die Werte unter einem anderen Schlüssel''
* ''Schließen Sie die Webseite und bearbeiten Sie das Beispiel erneut, erklären Sie die jetzigen Inhalte des Cookies''
* ''Parsen Sie den Cookie-Inhalt, sodass nur der Cookie-Wert des eigenen Schlüssels angezeigt wird''
* ''Recherchieren Sie wie die Gültigkeit eines Cookie-Wertes festgelegt wird''
* ''Legen Sie für Ihren Cookie-Wert eine kurze Gültigkeitsdauer fest und beobachten Sie was nach Ablauf passiert''
|}

==WebStorage==
{|
|style="width: 22em;vertical-align:top;"|<html>
<iframe width="420" height="290" src="//jsfiddle.net/pw_we1/mz7tqfb0/embedded/js,html,result/" frameborder="0"></iframe>
</html>
|style="vertical-align:top;padding-left:1em;"|
* ''xxx''
|}

==IndexedDB==
{|
|style="width: 22em;vertical-align:top;"| 
TODO
|style="vertical-align:top;padding-left:1em;"|
IndexedDB
|}

{{Projekt|Beispiellösung <document>WE1-P10.zip</document>}}