Erstellen Sie ein Cookie in 5 Schritten (Tutorial)

[Bildschirmfoto] Cookie-Kurs: Erstellen Sie ein Cookie in 5 Schritten

Cookies (Kekse) machen das Web persönlicher, Cookies erkennen Homepage-Besucher wieder und ermöglichen einen individuellen Service.

1. Verfalldatum festlegen

Jedes Cookie hat einen Namen (zum Beispiel "Benutzername"), einen Wert (zum Beispiel "John" oder "5") und ein Verfalldatum. Legen Sie zunächst ein Verfalldatum fest. Sobald es abläuft, wird der Cookie automatisch von der Festplatte gelöscht.

<!DOCTYPE html>
<html lang="de">
   <head>
   <meta charset="UTF-8">
    <title> Cookie </title>

  <script>
  var Verfallsdatum = new Date;
  Verfallsdatum.setMonth(Verfallsdatum.getMonth() + 2);

Die Zahl 2 steht für den Monatswert. Sie können den Wert auf 5 oder 10 (Monate) verlängern.

2. Stammgäste wiedererkennen

Um festzustellen, ob ein Besucher ihre Seite schon einmal besucht hat und seinen Namen in das Formularfeld eingetippt hat, schreiben Sie folgende Code-Zeile:

  var Besucher = "";
  if (document.cookie !="") {
   Besucher = document.cookie.split("_")[1];
  }

3. Cookie-Übergabe-Funktion

Definieren Sie nun eine Funktion die für die Übertragung des Cookies auf den PC des Besuchers zuständig ist:

  function CookieEinrichten() {
  var Besucher = document.Formular.Namenfeld.value;

   document.cookie = "_"
   + Besucher
   + "_"
   + ";expires="
   + Verfallsdatum.toGMTString()
   + "; path=/";
  }

Sie benötigen noch eine Ausgabefunktion in das Namenfeld für ein schon gesetztes Cookie:

  function CookieAusgabe() {
   document.Formular.Namenfeld.value = Besucher;
  }
  </script>

4. Mit einem Formular den Namen abfragen

Schreiben Sie anschließend das Formular, mit dem der Name des Besuchers abgefragt und das Cookie eingerichtet wird:

  </head>

  <body onLoad="CookieAusgabe()">

  <form name="Formular">
   Name:
   <input type="text" name="Namenfeld" onBlur="CookieEinrichten()">
  </form>

  </body>
  </html>

Der Befehl: onBlur="CookieEinrichten()" sorgt dafür, dass das Cookie eingerichtet wird, sobald der Besucher auf eine beliebige Stelle des Browser-Fensters außerhalb des Formulars klickt.

5. Besucher persönlich begrüßen (Cookie Ausgabe)

Um den Besucher bei seinem nächsten Besuch mit dem Namen anzusprechen, fügen Sie auf Ihre Startseite folgenden Code ein:

  <script>
  if (document.cookie != "") {
   document.write("Hallo " +
   document.cookie.split("_")[1] +
  ",schön, Dich auf meiner Seite wiederzusehen!");
}
  </script>

Ihre Homepage empfängt den Besucher ab jetzt mit der individuellen Begrüßung „Hallo [Besuchername], schön, Dich auf meiner Seite wiederzusehen!”

Beispiel 1: » Cookie Eingabe

Beispiel 2: » Cookie Ausgabe

Tipp

PHP Sessions (Sitzungen) und Cookies
Sitzungen sind eine weitere Methode, um Daten von einer Seite zu einer anderen Website verfügbar zu machen. Wenn ein Besucher auf eine Website zugreift, weist ihm der Server eine eindeutige ID (so genannte Sitzungs-ID oder SID) zu.