document.cookie: Cookies lesen und prüfen

Nach Cookies suchen

Der Benutzer kann das Cookie zwischenzeitlich gelöscht haben oder das Cookie ist abgelaufen. Darüber hinaus können sich beim Benutzer mehr Cookies dieser Seiten angesammelt haben (z.B. durch das Content Management System, durch Analytics wie Matomo oder Google Analytics oder Werbung auf der Seite), und das gewünschte Cookie muss zuerst herausgefiltert werden.

Man merkt der Cookie-Syntax und den Methoden an, dass Cookies eine alte Technik sind (1997!), zwar nicht besonders kompliziert, aber reichlich angestaubt. Es gibt keine Methoden, um ein einzelnes Cookie zu isolieren.

Javascript setzt und untersucht Cookies über das globale document.cookie. Beim Auslesen verhält sich document.cookie wie ein String und gibt eine Semikolon-getrennte Liste aller Cookies des aktuellen Dokuments zurück. Nur eine Suche im Cookie-String bringt einen bestimmten Cookie-Wert zutage.

document.cookie
   cookiereader=4711; status=allow; 
   buttons=green large top; 

Nach einem bestimmten Cookie suchen:

function getCookieValue(a) {
   const b = document.cookie.match('(^|;)\\s*' + a + '\\s*=\\s*([^;]+)');
   return b ? b.pop() : '';
}

console.log ("getCookieValue " + getCookieValue("cookiereader"));

Wenn Javascript das erwartete Cookie nicht findet, gibt das Script einen leeren String zurück. Das passiert z.B., wenn der Besucher die Cookies in seinem Browser gelöscht hat.

Cookies dekodieren

Cookies sind oft kodiert, damit sie keine unerlaubten Zeichen enthalten. Sind sie z.B. URI-enkodiert (encodeURIComponent), können sie mit decodeURIComponent dekodiert werden.

const rawValue = getCookieValue("cookiereader");
const decodedValue = decodeURIComponent(rawValue);

Alle Cookies lesen

Früher galt, dass individuelle Cookies durch ein Semikolon gefolgt von einem Leerzeichen getrennt werden. Darauf sollte man sich nicht mehr verlassen. Ebenso darf vor und nach dem Gleichheitszeichen zwischen Cookie-Name und Cookie-Wert ein Leerzeichen sitzen.

Zuerst alle sichtbaren Cookies in ein Hash extrahieren, um das gesuchte Cookie zu untersuchen.

• Die Liste der Cookies aus document.cookie lesen
• Die Liste anhand des Semikolons in einzelne Cookies splitten.
• Jedes Cookie in Name und Wert splitten
• Cookies nach Namen indexieren
• Das gewünschte Cookie herausfiltern und den Wert des Cookies dekodieren

const cookieList = (document.cookie) ? document.cookie.split(';') : [];

const cookieValues = {};
for (let i = 0, n = cookieList.length; i != n; ++i) {
	const cookie = cookieList[i];
	const f = cookie.indexOf('=');
	if (f >= 0) {
		const cookieName = cookie.substring(0, f);
		const cookieValue = cookie.substring(f + 1);
		//console.log (`cookieName ${cookieName} – cookieValue ${cookieValue}`);
		if (!cookieValues.hasOwnProperty(cookieName)) {
			cookieValues[cookieName] = cookieValue;
		}
	}
}

Quelle Inspect the value of a cookie in JavaScript

Cookies löschen

Um ein Cookie zu löschen, setzt man einen Zeitpunkt in der Vergangenheit. Der Browser sieht darin das abgelaufene Cookie und löscht es aus seinen Speicher.

Kompliziert ist allenfalls das Ablaufdatum. Alles beginnt mit dem aktuellen Zeitpunkt – date.getTime():

const date = new Date();
date.setTime (date.getTime() + 
    days * 24 * 60* 60 * 1000);
      ^     ^
      |     |
      |     +-- Tage in Millisekunden umsetzen
      |
      +--- Tage bis zum Ablaufdatum
const expires = date.toGMTString();

Viel einfacher funktioniert das Löschen des Javascript-Cookies mit dem neueren max-age: max-age=0

document.cookie = "theme=twenty; 
                   max-age=0; 
                   path=/; 
                   domain=myhome.me"