Cookie in JavaScript setzen

Migel Hewage Nimesha 15 Februar 2024
  1. Cookie in JavaScript setzen
  2. Legen Sie ein Ablaufdatum für ein Cookie fest
  3. Legen Sie einen Pfad für ein Cookie fest
  4. die Funktion setCookie()
Cookie in JavaScript setzen

Ein Cookie ist eine Information, die eine Verbindung zwischen Client- und Serverseite ermöglicht. Der Webbrowser speichert sie zum Zeitpunkt des Surfens.

Im Allgemeinen enthält ein Cookie Daten im Format eines durch Semikolons getrennten Name-Wert-Paares als Zeichenfolge. Außerdem behält ein Cookie den Zustand des Benutzers bei und sammelt die Informationen des Benutzers über alle Webseiten hinweg.

Bei JavaScript kann ein Cookie mit der Eigenschaft document.cookie erstellt, gelesen, aktualisiert und gelöscht werden. Ein Cookie besteht aus sechs Segmenten: name, Wert, Ablauf, Pfad, Domäne und Sicherheit, gemäß der folgenden Syntax.

Syntax:

document.cookie = 'name=VALUE; expires=DATE; path=PATH; domain=DOMAIN; secure';

Dabei ist das Vorhandensein des ersten Segments: name=VALUE zwingend erforderlich, die weiteren Segmente können je nach Bedarf vom Benutzer bereitgestellt werden.

document.cookie = 'new_cookie'

Betrachten Sie zunächst jedes Segment im Detail als Start-up mit der obigen Syntax.

  1. Der Befehl document.cookie erstellt ein neues Cookie.
  2. Hier ist new_cookie die Zeichenfolge, die den Wert des Cookies festlegt, und hat die Syntax name=VALUE, wobei name implizieren sollte, was das Cookie in einem lesbaren Format speichern soll, und VALUE. ist einfach der Wert, der vom Benutzer als bevorzugt angegeben wird.

Ein Beispiel zum Setzen eines Cookies:

document.cookie = 'username=John Ricks';

Hier wird das Cookie mit dem Namen username und dem Wert John Ricks gespeichert.

Ausgang:

Benutzername-Cookie setzen

Ein Cookie läuft automatisch ab, basierend auf dem Ablaufdatum des Benutzers, das auf dem Code festgelegt ist. Wenn kein Ablaufdatum festgelegt ist, wird das Cookie entfernt, wenn der Browser durch den Benutzer geschlossen wird, wodurch verhindert wird, dass der Benutzer die Cookie-Werte beim Besuch der Webseiten wiederverwendet.

Wir können dieses Problem umgehen, indem wir ein Ablaufdatum für das Cookie festlegen, indem Sie einfach expires=DATE in UTC (Universal Time Coordinated) hinzufügen, ein Zeitstandard, der durch ein Semikolon getrennt ist, wie im folgenden Beispiel.

document.cookie = 'username=John Ricks; expires=Wed, 31 Aug 2022 21:00:00 UTC';

Ausgang:

Legen Sie ein Ablaufdatum für ein Cookie fest

Mit dem Parameter Pfad kann der Benutzer dem Browser mitteilen, zu welchem Pfad das Cookie im Verzeichnis oder auf der Webseite gehört. Standardmäßig gehört das Cookie zu der aktuellen Seite, auf die der Benutzer zugreift.

Dieser Pfad kann leer sein, sobald wir das Cookie von einem Verzeichnis oder einer Webseite erhalten. Dieser Parameter ändert, wo das Cookie auf dem Computer des Benutzers gespeichert wird, und ist beim Speichern vertraulicher Informationen von Vorteil, da es schwer zu finden ist.

Wir können den Pfad zu einem Cookie hinzufügen, wie im folgenden Code.

document.cookie =
    'username=John Ricks; expires=Wed, 31 Aug 2022 21:00:00 UTC; path=/'

Ausgang:

Pfad für ein Cookie festlegen

Außerdem können je nach Notwendigkeit beim Setzen eines Cookies eine domain und eine Sicherheit hinzugefügt werden. Der Zweck des Hinzufügens einer Domain besteht darin, Cookies für andere Subdomains zuzulassen.

Der sichere Teil ist ein boolescher Wert, wobei der Standardwert false ist, ein leeres Feld. Wenn das Cookie als sicher gekennzeichnet ist, ist der Wert true, das Cookie wird also an einen Webserver gesendet und kann nur über einen sicheren Kommunikationskanal abgerufen werden.

die Funktion setCookie()

Wir können Cookie-Werte mithilfe einer JavaScript-Funktion festlegen, ohne die Cookie-Werte fest zu codieren, was in den meisten Fällen von begrenztem Nutzen sein kann. Der folgende Code definiert die Funktion setCookie().

let username = 'John Ricks';

// To set a cookie
function setCookie(cookie_name, cookie_value, expire_date) {
  const c_d = new Date();  // current date
  c_d.setTime(c_d.getTime() + (expire_date * 24 * 60 * 60 * 1000));
  let expires = 'expires=' + c_d.toUTCString();
  document.cookie =
      cookie_name + '=' + cookie_value + '; ' + expires + '; path=/';
}
// to apply setCookie
setCookie('username', username, 20);

Ausgang:

Cookie setzen

Diese Funktion erstellt ein Cookie mit dem Namen Benutzername und dem Wert John Ricks und einem Ablaufdatum von 20 Tagen ab dem Datum, an dem wir es generiert haben.

Ebenso können wir JavaScript-Funktionen verwenden, um ein Cookie zu erhalten, indem wir eine getCookie()-Funktion erstellen, und Cookies können bei Bedarf auch aktualisiert oder gelöscht werden.

Migel Hewage Nimesha avatar Migel Hewage Nimesha avatar

Nimesha is a Full-stack Software Engineer for more than five years, he loves technology, as technology has the power to solve our many problems within just a minute. He have been contributing to various projects over the last 5+ years and working with almost all the so-called 03 tiers(DB, M-Tier, and Client). Recently, he has started working with DevOps technologies such as Azure administration, Kubernetes, Terraform automation, and Bash scripting as well.

Verwandter Artikel - JavaScript Cookie