SELFHTML: JavaScript / Anwendungsbeispiele / Persönliche Seitenbesuche zählen mit Cookies

SELFHTML/Quickbar JavaScript Anwendungsbeispiele

	Persönliche Seitenbesuche zählen mit Cookies
	Persönliche Seitenbesuche zählen mit Cookies - das Beispiel

Persönliche Seitenbesuche zählen mit Cookies - das Beispiel

Anzeigebeispiel: So sieht's aus

Cookies (Kekse) sind ein nicht unumstrittenes Feature, das Netscape in JavaScript eingebaut hat. Cookies erlauben einem JavaScript-Programm, Daten auf der Festplatte des Anwenders zu speichern. Dies geschieht jedoch in kontrollierter Form. Ein "Ausspionieren" der Anwenderfestplatte ist dabei ebenso wenig möglich wie das Plazieren von ausführbarem Code, also etwa Viren. Denn wenn Sie in einem JavaScript einen Cookie schreiben, können Sie nicht angeben, wohin der Cookie beim Anwender gespeichert wird. Das kontrolliert der WWW-Browser des Anwenders. Außerdem können Cookies keine unkontrollierten Datenmengen auf den Anwenderrechner schreiben, sondern nur eine begrenzte Anzahl von Zeilen. Jede solcher Zeilen definiert eine Variable und weist dieser Variablen einen Wert zu. Ein Cookie läßt sich also mit einem Eintrag in einer Konfigurationsdatei vergleichen - mit dem Unterschied, daß der Cookie keine Konfigurationsdaten des Anwenderrechners ansprechen kann.

Durch die Möglichkeit, Daten zu speichern, werden jedoch viele neue Anwendungsbereiche für JavaScript möglich. So auch das hier beschriebene Beispiel. Denn um zeitlich auseinanderliegende Seitenbesuche zu zählen, muß man die Anzahl der bisherigen Seitenbesuche irgendwo fest speichern, beim nächsten Seitenbesuch wieder auslesen, den Zähler um 1 erhöhen und den neuen Wert wieder speichern. Genau das tut das hier beschriebene Beispiel.

Beachten Sie:

Das Zählen von persönlichen Seitenbesuchen ist etwas anderes als das Zählen aller Seitenbesuche. Um alle Zugriffe auf eine Seite zu verwalten, muß das Programm seine Zählerstände auf dem Server-Rechner ablegen. Deshalb funktioniert ein klassischer "Counter" nur mit CGI. Das hier beschriebene Script zählt nur, wie oft ein bestimmter Anwender eine bestimmte Seite besucht.

Der MS Internet Explorer interpretiert Cookies nur vollständig, wenn die HTML-Datei, die Cookies liest und schreibt, vom Browser über das HTTP-Protokoll aufgerufen wird.

Hinweis: Zur besseren Orientierung enthält das Beispiel Verweise zu den entsprechenden Erläuterungen, z.B. 1*. Diese Verweise gehören nicht zum Quellcode. Falls Sie das Beispiel in einen Editor kopieren, müssen Sie diese Verweise löschen. Andernfalls erhalten Sie JavaScript-Fehlermeldungen.

Beispiel:

 <html>
 <head>
 <title>Seitentitel</title>
 <script language="JavaScript">
  <!--
  1* function WertHolen()
  {
   var Wert = "";
   if(document.cookie) 
   {
    Wertstart = document.cookie.indexOf("=") + 1;
    Wertende = document.cookie.indexOf(";");
    if(Wertende == -1) Wertende = document.cookie.length;
    Wert = document.cookie.substring(Wertstart,Wertende);
   }
   return Wert;
  }

  2* function WertSetzen(Bezeichner, Wert, Verfall)
  {
   var jetzt = new Date();
   var Auszeit = new Date(jetzt.getTime() + Verfall);
   document.cookie = Bezeichner+"="+Wert+"; expires="+Auszeit.toGMTString()+";";
  }

  3* function Zaehlerstand() 
  {
   var Verfallszeit = 1000*60*60*24*365;
   var Anzahl = WertHolen();
   var Zaehler = 0;
   if(Anzahl != "") Zaehler = parseInt(Anzahl);
   if(document.cookie)
   {
    Zaehler = Zaehler + 1;
    WertSetzen("Zaehler",Zaehler,Verfallszeit);
   } 
   else 
   {
    Zaehler = 1;
    WertSetzen("Zaehler",Zaehler,Verfallszeit);
   } 
  alert("Dies ist Ihr " + Zaehler + ". Besuch auf dieser Seite!");
  }
  //-->
 </script>
 </head>
 <body onLoad="Zaehlerstand()">
 Inhalt der Datei
 </body>
 </html>

Erläuterung:

Cookie lesen und gespeicherten Wert ermitteln
Die Funktion WertHolen(), die im Beispiel definiert ist, ist allgemein geschrieben. Sie können diese Funktion nutzen, um einen Cookie auszulesen. Wenn die Datei schon einmal einen Cookie geschrieben hat, wird dessen Wert ermittelt und zurückgegeben. Wenn noch kein Cookie existiert, wird eine leere Zeichenkette "" zurückgegeben.

Mit der Abfrage if(document.cookie) ermittelt die Funktion, ob bereits ein Cookie vorhanden ist. Wenn ja, wird dessen Wert ermittelt. Ein Cookie besteht normalerweise aus einem Bezeichner und einem Wert, zum Beispiel:
Zaehler=4
Dabei ist Zaehler der Bezeichner und 4 der Wert, der diesem Bezeichner zugewiesen ist. Die Funktion WertHolen() holt sich den Wert, indem sie mit indexOf()-Befehlen den Anfang und das Ende des Wertes innerhalb des gespeicherten Cookies ermittelt. Diesen Wert weist sie der Variablen Wert zu. Die Variable Wert wird am Ende der Funktion zurückgegeben.

Cookie schreiben und Wert setzen
Die Funktion WertSetzen(), die im Beispiel definiert ist, ist ebenfalls allgemein geschrieben. Diese Funktion erwartet drei Parameter:
Bezeichner ist das Element vor dem Istgleichzeichen, zum Beispiel Zaehler.
Wert ist der Wert, der dem Bezeichner zugewiesen und mit gespeichert werden soll.
Verfall ist eine Zahl, die als Anzahl Millisekunden interpretiert wird. Jeder Cookie, der über die aktuelle Browser-Sitzung hinaus gespeichert bleiben soll, muß eine Angabe dazu enthalten, wann der Browser den Cookie löschen soll. Das soll verhindern, das Cookies "ewig" gespeichert bleiben. Der Verfallszeitpunkt des Cookies muß in Form des GMT-Zeitformats angegeben werden. Darum brauchen Sie sich aber nicht zu kümmern, da die Funktion WertSetzen() dies automatisch erledigt. Die Funktion ermittelt zu diesem Zweck die aktuelle Zeit (var jetzt = new Date();). In der Variablen Auszeit errechnet sie einen zukünftigen Zeitpunkt aus dem übergebenen Parameter Verfall und dem ermittelten aktuellen Zeitpunkt.

Mit der Anweisung, die mit document.cookie = beginnt, wird der Cookie geschrieben.

Übergeordnete Funktion zum Verwalten des Cookies
Die beiden allgemeinen Funktionen WertHolen() und WertSetzen() benötigen nun noch ein paar allgemeine Anweisungen, die den Cookie verwalten. Dies geschieht im Beispiel in der Funktion Zaehlerstand(). Zunächst definiert diese Funktion einen Verfallswert, der später beim Schreiben des Cookies an die Funktion WertSetzen() übergeben wird. Mit dem Rechenausdruck 1000*60*60*24*365 wird die Millisekundenzahl eines Jahres ermittelt. Der Cookie soll also ein Jahr lang gespeichert werden.

Um die persönlichen Seitenbesuche des Anwenders zu verwalten, muß die Funktion Zaehlerstand() folgendes tun: sie muß erstens den aktuellen Zählerstand ermitteln, zweitens den Zähler um 1 erhöhen und drittens den neuen Zählerstand wieder speichern. Wenn noch kein Cookie vorhanden ist, d.h. wenn der Anwender die Seite zum ersten Mal besucht, muß der Zähler auf 1 gesetzt und gespeichert werden.

Zuerst ruft die Funktion Zaehlerstand() deshalb die Funktion WertHolen() auf, um den aktuellen Zählerstand zu ermitteln. Der Rückgabewert von WertHolen() wird in der Variablen Anzahl gespeichert. Wenn noch kein Cookie vorhanden ist, steht in Anzahl anschließend eine leere Zeichenkette "". Ist ein Wert vorhanden, enthält Anzahl den Wert in Form einer Zeichenkette. Da man mit Zeichenketten nicht rechnen kann, zum Hochzählen des Zählers jedoch ein numerischer Wert benötigt wird, wird im Beispiel noch eine numerische Variable namens Zaehler definiert. Mit der parseInt()-Methode wird dieser Variablen der Wert von Anzahl als Zahl zugewiesen.

Wenn ein Cookie vorhanden ist, wird der Zähler um 1 erhöht. Anschließend wird die Funktion WertSetzen() aufgerufen, die den Cookie speichert. Als Bezeichner wird das Wort "Zaehler" übergeben, als Wert der Inhalt der Variablen Zaehler, und als Verfallszeitpunkt der Inhalt der Variablen Verfallszeit.

Wenn kein Cookie vorhanden ist, wird die Funktion Funktion WertSetzen() genauso aufgerufen. Vorher wird jedoch der Inhalt der Variablen Zaehler auf 1 gesetzt.

Am Ende gibt die Funktion Zaehlerstand() mit Hilfe von alert() den aktuellen Zählerstand in einem Meldungsfenster aus.

Alle Anweisungen des Beispiel-Scripts stehen innerhalb von Funktionen. Damit diese Anweisungen beim Einlesen der Datei überhaupt ausgeführt werden, muß die Funktion Zaehlerstand() explizit aufgerufen werden. Das passiert im Beispiel im einleitenden <body>-Tag mit Hilfe des Event-Handlers onLoad=.


weiter:	Formulareingaben überprüfen
zurück:	Monatskalender

SELFHTML/Quickbar JavaScript Anwendungsbeispiele