IT-Academy Logo
Sign Up Login Help
Home - Programmieren - JavaScript - JavaScript: Besucherdaten speichern



JavaScript: Besucherdaten speichern

Dieses Tutorial zeigt wie mann das recht komplexe Thema der Cookies einfach erlernen kann um damit Besucherdaten zu speichern wieder zu verwerten.


Autor: Patrick Faes (dreamer)
Datum: 13-07-2005, 22:05:12
Referenzen: siehe Text
Schwierigkeit: Fortgeschrittene
Ansichten: 10642x
Rating: 8 (1x bewertet)

Hinweis:

Für den hier dargestellte Inhalt ist nicht der Betreiber der Plattform, sondern der jeweilige Autor verantwortlich.
Falls Sie Missbrauch vermuten, bitten wir Sie, uns unter missbrauch@it-academy.cc zu kontaktieren.

[Druckansicht] [Als E-Mail senden] [Kommentar verfassen]



Einführung

"Cookies" bedeutet "Kekse". Sie fragen sich jetzt wohl was Kekse mit JavaScript zu tun haben. Nun, Cookies sind Dateien worin ein Browser Daten (z.B. Passwörter, Datum des letzten Besuches usw.) speichern kann. Woher der Name "Cookie" kommt, weiß eigentlich keiner so genau.

Cookies haben sehr umfangreiche Anwendungszwecke: es ist möglich damit Passwörter zu speichern, das Datum vom letzten Besuch zu einer bestimmten Seite zu speichern, bestimmte Vorlieben eines bestimmten Besuchers zu speichern um eine Seite dann nach seinem Gesmack zu gestalten usw. Cookies können sowohl vom Client als vom Server ausgelesen werden.

Allerdings sollten Sie sich nicht zu sehr auf Cookies verlassen, denn viele Leute schalten diese Funktion aus Sicherheitsgrüden ab. Natürlich können in Cookies keine private Daten wie Kreditkartennummer oder Windows-Passwörter gespeichert werden. Ebenfalls ist ein Cookie nur auslesbar auf derselben Website wo er initialisiert wurde, aber manche Leute werden halt nicht gerne ausspioniert im Bezug zu was sie im Internet so anstellen.

Obwohl Cookies tolle Möglichkeiten bieten, ist ihre Handhabung nicht so selbstverständlich. Dieses Tutorial zeigt wie Sie mit selbst erstellte Funktionen Daten in Cookies speichern und später wieder auslesen können. Hinzu kommt noch eine Funktion um ein Cookie zu löschen.

Daten speichern

Sie können ein Cookie erstellen mit folgender Funktion:
function speichern(CookieName, CookieValue, CookieExpireDate)
{
  var EndDatum = '';
  if (CookieExpireDate != false)
  {
    var Datum = CookieExpireDate.split('-');
    var MyExpire = new Date();
    MyExpire.setDate(Datum[0]);
    MyExpire.setMonth(Datum[1] - 1);
    MyExpire.setYear(Datum[2]);
    EndDatum = ";expires=" + MyExpire.toGMTString();
  }
  document.cookie = CookieName + "=" + escape(CookieValue) + EndDatum;
}

speichern('Cookie1', 'Wert1', '5-11-2005');
speichern('Cookie2', 'Wert2', false);
Jedes Cookie braucht mindestens zwei Parameter: einen Namen und einen Wert. Optional kann auch noch ein Enddatum aufgegeben werden.
  • Name: der Name soll ein Variable vom Stringtyp sein und darf keine Leerstellen oder Sonderzeichen enthalten und fängt bevorzugt an mit einem Buchstaben
  • Wert: der Wert kann ungefähr alles sein, muss aber in einem Stringtyp konvertiert werden und wird später in Unicode umgewandelt um so die höchstmögliche Kompatibilität zu gewährleisten
  • Datum: das Datum muss wie folgt notiert werden: "Tag Strich Monat Strich Jahr" (Beispiel: 5-11-2005). Dieses Datum ist das Datum an dem der Browser das Cookie löschen soll. Beachten Sie aber, dass die meisten Browser eigene Usereinstellungen haben um zu bestimmen wie mit Cookies umgegangen werden soll.
    Wenn Sie kein Enddatum angeben wollen (dazu schreiben Sie false als dritten Parameter), wird das Cookie nach der Browsersession sofort gelöscht.
Zuerst wird die Funktion das Enddatum erstellen. Wenn der Parameter CookieExpireDate gleich false ist, dann wird die Variable EndDatum am Ende noch immer leer sein.

Um das Datumobjekt zu erstellen, wird mit der Funktion split() der übergebene Datumstring an den Bindestrichen zerstückelt. Diese werden dann verwendet um das Datumobjekt zu erstellen (lesen Sie dazu noch den Artikel Datum und Uhrzeit benutzen). Die Variable EndDatum bekommt dann den Wert ";expires=" plus das Datum. Das Datum wird dann erst noch mit der Funktion toGMTString() umgesetzt in einem String. Heute ist z.B. .

In der letzten Zeile der Funktion wird dann das Cookie gespeichert. Hier weicht die Syntax von der üblichen JavaScript-Notation ab. Ein einzelnes Cookie ist kein Unterobjekt, sondern ein Wert vom Objekt "Cookie". Die Notation sieht wie folgt aus: document.cookie = Variablenname + '=' + Variablenwert. Dieser kann dann noch ein Enddatum verpasst bekommen. Dazu wird folgendes hinzugefügt: ';expires='.

Der Wert wird dabei mit der Funktion escape() in Unicode umgewandelt. Dies sorgt dafür, dass Sonderzeichen ersetzt werder durch ein Code um so zu verhindern, dass diese einen Browser dazu veranlassen das Script falsch auszuführen. Zuletzt soll noch gesagt sein, dass mit obigem Script eine einzelne Variable in einem Cookie gespeichert wird. Wenn Sie mehrere Variablen in einem Cookie speichern möchten, dann müssen Sie diese Variablen alle einzeln an der Funktion speichern() übergeben.

Ein Cookie auslesen

Die Funktion um ein Cookie auszulesen sieht wie folgt aus:
function auslesen(CookieName)
{
  var dc = "" + document.cookie;
  var Muster = 'dc.match(/' + CookieName + '=(.+)/)';
  eval(Muster);
  var Wert = unescape(RegExp.$1);
  return Wert;
}

var Besucher = auslesen('Besucher');
Um den Wert einer Cookievariable zu bekommen, übergeben Sie den Namen der Cookievariable an der Funktion auslesen(), welcher nachher den Wert der Cookievariable zurückgibt, so dass dieser gespeichert werden kann. In diesem Beispiel wird der Wert der Cookievariable Besucher ausgelesen und gespeichert in Besucher.

Auf der ersten Zeile der Funktion wird das Objekt "Cookie" in der Variable dc gespeichert. Vor dem Objekt stehen zusätzlich noch Anführungszeichen um sicher zu stellen dass der Browser die Variable als Stringobjekt interpretiert (anscheinend gibt es Probleme mit manche Browser wenn Sie dies nicht tun).

Danach wird ein Muster für eine Suche mit einem regulärem Ausdruck erstellt. Das Muster wird dann verwendet um den Wert der Cookiesvariable heraus zu filtern. Die Syntax für reguläre Ausdrücke finden Sie bei SelfHTML.de.

JavaScript hat allerdings Probleme damit Variablen in einem Muster zu setzen. Daher wird der Code in eine Variable gespeichert und mit der Funktion eval() ausgeführt.

Der Wert der Cookievariable können wir dann auslesen mit RegExp.$1 . Dieser Wert wird mit der Funktion unescape() wieder umgesetzt von Unicode in normale ASCII-Zeichen. Dieser Wert wird dann zurückgegeben und wird dann in eine Variable gespeichert (im obigen Codebeispiel Besucher).

Ein Cookie löschen

function loeschen(CookieName)
{
  var EndDatum = new Date();
  var Heute = EndDatum.getDate();
  Datum.setDate(Heute - 2);
  document.cookie = CookieName + "=" + '' + ';expires=' + EndDatum.toGMTString();
}

loeschen('CookieName');
JavaScript hat keine eingebaute Funktion um ein Cookie zu löschen. In der Praxis baut mann dann einfach eine Funktion die das Cookie neu speichert, jedoch mit einem Enddatum das zwei Tage vor dem aktuellen Datum liegt. Dadurch wird der Browser das Cookie sofort löschen.


[back to top]



Userdaten
User nicht eingeloggt

Gesamtranking
Werbung
Datenbankstand
Autoren:04511
Artikel:00815
Glossar:04116
News:13565
Userbeiträge:16552
Queueeinträge:06248
News Umfrage
Ihre Anforderungen an ein Online-Zeiterfassungs-Produkt?
Mobile Nutzung möglich (Ipone, Android)
Externe API Schnittstelle/Plugins dritter
Zeiterfassung meiner Mitarbeiter
Exportieren in CSV/XLS
Siehe Kommentar



[Results] | [Archiv] Votes: 1158
Comments: 0