Cookies und localStorage

Cookies - kleine Datenpakete - dienen in der Javascript-Programmierung dazu, Informationen (z.B. über die Webseitennutzung) auf den Computern der Nutzer zu speichern. Man kann Cookies z.B. nutzen, um den persönlichen Highscrore in einem in Javascript programmierten Programm zu speichern. Solch ein Highscore ist dann natürlich nur auf dem Computer vorhanden, auf dem das Javascript-Programm läuft.
siehe z.B. https://www.w3schools.com/js/js_cookies.asp

Sicherheit / Cookies einschalten und ausschalten

Nutzer von Webseiten können verhindern, dass Cookies auf Ihrem System geschrieben werden. Allerdings kümmern sich die Wenigsten darum.
Beispiel Mozilla Firefox:

Cookies nutzen in eigenen Webseiten

Beispiel:
<!DOCTYPE html>
<html>
 
<head>
 
  <title>Cookies nutzen</title>
  <meta charset="utf-8">
 
</head>
 
<body>
 
  <script type="text/javascript">
 
    var saved;
 
    if( document.cookie )
    {
      saved = document.cookie;
      document.write( saved );
    }
    else
    {
      document.cookie = "Zeitstempel=" + document.lastModified;
    }
 
    alert( document.lastModified + " - " + saved );
 
  </script>
 
</body>
 
</html>



localStorage

Es gibt seit HTML5 aber auch weitere Möglichkeiten, u.a.
Man kann Daten in Webseiten speichern und diese zwischen mehreren Seiten auszutauschen, z.B. wie folgt:
...
 
function speichern( x )
{
    localStorage.setItem("dingsda", x);
}
function laden()
{
    document.formular.eingabe.value = localStorage.getItem("dingsda");
}
 
...
 
<form name="formular">
 
  <input type="text"
         name="eingabe"
         value="nix"
         onchange="speichern( this.value )" onfocus="laden()">
</form>
 
...
 
Ein weiteres Beispiel mit zwei identischen Webseiten test1.html und test2.html
Nach dem Ändern des Namens auf Seite1 kann man Seite2 besuchen und bekommt diesen Namen dann dort angezeigt.
...
 
<div id="result">
 
</div>
 
<script>
 
// Meldung, falls der Browser die Speicherfunktion nicht unterstützt
function doesnotsupport()
{
  document.getElementById("result").innerHTML = "Sorry, your browser does not support Web Storage...";
}
 
// Anzeige des gespeicherten Namens
function showMyName()
{
  if (typeof(Storage) !== "undefined")
  {
    // Retrieve
    document.getElementById("result").innerHTML = localStorage.getItem("lastname");
  }
  else
    doesnotsupport();
}
 
// Überschreiben des gespeicherten Namens
function changeMyName( x )
{
  if( x=="" ) return;
 
  if (typeof(Storage) !== "undefined") {
    // Store
    localStorage.setItem("lastname", x);
    showMyName();
  }
  else
    doesnotsupport();
}
 
// sofortige Anzeige des Namens bei Start der Seite
showMyName();
 
</script>
 
<form name="myForm">
 
  <input type="text" name="myName" onchange="changeMyName(this.value)">
 
</form>
 
 
Hinweis: localStorage funktioniert nur bei eingeschalteten Cookies!

Eine Datei mit ausführlicherem Coding zum weiteren Testen: