Heim  >  Artikel  >  Web-Frontend  >  So setzen Sie Cookies in Javascript

So setzen Sie Cookies in Javascript

青灯夜游
青灯夜游Original
2021-04-19 13:52:4520097Durchsuche

In JavaScript können Sie das Cookie-Attribut des Dokumentobjekts verwenden, um Cookies zu setzen, zu lesen oder zu löschen. Die Syntax lautet „document.cookie="cookieName=Value;expires=expiration time";".

So setzen Sie Cookies in Javascript

Die Betriebsumgebung dieses Tutorials: Windows 7-System, JavaScript-Version 1.8.5, Dell G3-Computer.

1. Was ist ein Cookie? HTTP, das zum Laden von Webseiten in Browser verwendet wird, ist ein „zustandsloses“ Protokoll. Das heißt, wenn der Server die Seite an den Browser sendet, betrachtet er sie als abgeschlossen Informationen werden gespeichert. Dadurch ist es schwierig, während einer Browsersitzung eine gewisse Kontinuität aufrechtzuerhalten, z. B. die Aufzeichnung der Inhalte, auf die ein Benutzer zugegriffen oder sie heruntergeladen hat, oder die Aufzeichnung des Anmeldestatus des Benutzers in einem privaten Bereich.

Cookies sind eine Möglichkeit, dieses Problem zu lösen. Ein Cookie kann beispielsweise den letzten Besuch des Benutzers aufzeichnen, eine Liste der Präferenzen des Benutzers speichern oder die Artikel im Warenkorb speichern, während der Benutzer weiter einkauft. Bei korrekter Verwendung können Cookies das Benutzererlebnis der Website verbessern.


Das Cookie selbst ist eine kurze Informationsfolge, die von der Seite auf dem Computer des Benutzers gespeichert und dann von anderen Seiten gelesen werden kann. Grundsätzlich sind Cookies so eingestellt, dass sie nach einer bestimmten Zeit ablaufen.


Beschränkungen von Cookies

Browser haben Beschränkungen hinsichtlich der Anzahl der Cookies, die gespeichert werden können, normalerweise einige Hundert oder mehr. Im Allgemeinen sind 20 Cookies pro Domain zulässig und jede Domain kann bis zu 4 KB Cookies speichern.

Zusätzlich zu den Problemen, die durch Größenbeschränkungen verursacht werden können, gibt es viele Gründe, die dazu führen können, dass Cookies auf der Festplatte verschwinden, z. B. das Erreichen des Ablaufdatums, das Löschen der Cookie-Informationen durch den Benutzer oder das Wechseln zu einem anderen Browser. Daher sollten Cookies niemals zum Speichern wichtiger Daten verwendet werden. Beim Schreiben von Code müssen Sie die Situation berücksichtigen, in der das erwartete Cookie nicht abgerufen werden kann. 2, document.cookie-Attribut. JavaScript verwendet das Dokumentobjekt-Cookie Attribute zum Erstellen, Lesen und Löschen von Cookies.


Jedes Cookie ist im Grunde eine Zeichenfolge, die aus einem Paar aus Name und Wert besteht, wie folgt:


username=sam

Wenn die Seite in den Browser geladen wird, sammelt der Browser alle mit der Seite verbundenen Cookies und platziert sie in der Zeichenfolge -ähnliches document.cookie-Attribut. In diesem Attribut wird jedes Cookie durch ein Semikolon getrennt:

username=sam;location=China;
#Ich nenne document.cookie ein „stringartiges“ Attribut, weil es kein echter String ist, aber beim Extrahieren von Cookie-Informationen verhält sich dieses Attribut wie ein String Datenkodierung und -dekodierung


Bestimmte Zeichen können in Cookies nicht verwendet werden, darunter Semikolons, Kommas und Leerzeichen (wie Leerzeichen und Tabulatoren). Bevor Daten in einem Cookie gespeichert werden, müssen die Daten verschlüsselt werden, damit sie korrekt gespeichert werden können.


Bevor Sie die Informationen speichern, verwenden Sie zum Codieren die Escape()-Funktion von JavaScript. Wenn Sie die ursprünglichen Cookie-Daten erhalten, verwenden Sie zum Decodieren die entsprechende unescape()-Funktion.

Die Funktion excape() konvertiert alle Nicht-ASCII-Zeichen in der Zeichenfolge in das entsprechende zweistellige oder vierstellige Hexadezimalformat, z. B. werden Leerzeichen in %20 und & in %26 umgewandelt.

Der folgende Code gibt beispielsweise die in der Variablen str gespeicherte Originalzeichenfolge und das Ergebnis nach der Escape()-Kodierung aus:

100db36a723c770d327fc0aef2ce13b1
93f0f5c25f18dab9d176bd4f6de5d30e
3f1c4e4b6b16bbbd69b2ee476dc4f83a
function hello(){
	var str = 'Here is a (short) piece of text.';
	document.write(str = 'ff9d32c555bb1d9133a29eb4371c1213' + escape(str));
	}
2cacc6d41bbb37262a98f745aa00fbf0
9c3bca370b5104690d9ef395f2c5f8d1
6c04bd5ca3fcae76e30b72ad730ca86d
64cb571ed5952d9b43da1f2d70a36e91hello owrld0b9f73f8e206867bd1f5dc5957dbcb38
a378d60a65ed2f7e1382e9de1336cde9
16b28748ea4df4d9c2150843fecfba68
36cc49f0c466276486e50c850b7e4956
73a6ac4ed44ffec12cee46588e518a5e

Sie können sehen, dass das Leerzeichen als %20 dargestellt wird und die linke Klammer es ist %28, Die rechte Klammer ist %29.


3, Cookie-Zusammensetzung

Die Informationen in document.cookie sehen aus wie eine Zeichenfolge, die aus Paaren von Namen und Werten besteht. Die Form jedes Datenpaars ist:

name=value

Aber tatsächlich Oben, jedes Cookie enthält auch einige andere verwandte Informationen, die im Folgenden separat vorgestellt werden.


cookieName und cookieValue CookieName und cookieValue sind die Namen und Werte in name=value, die in der Cookie-Zeichenfolge zu sehen sind.


domain


Das Domain-Attribut zeigt dem Browser an, zu welcher Domain das Cookie gehört. Dieses Attribut ist optional, wenn es nicht angegeben wird. Der Standardwert ist die Domäne der Seite, auf der das Cookie gesetzt ist.
Die Funktion dieses Attributs besteht darin, den Betrieb von Cookies durch Subdomains zu steuern. Was die Entfernung angeht: Wenn es auf www.example.com eingestellt ist, kann die Seite in der Subdomain code.example.com dieses Cookie nicht lesen. Wenn das Domänenattribut jedoch auf example.com gesetzt ist, kann die Seite in code.example.com auf dieses Cookie zugreifen.


Pfad


Das Pfadattribut gibt das Verzeichnis an, in dem Cookies verwendet werden können. Wenn Sie möchten, dass nur Seiten im Verzeichnis „Dokumente“ den Cookie-Wert festlegen, legen Sie den Pfad auf „/documents“ fest. Dieses Attribut ist optional und der häufig verwendete Standardpfad ist /, was angibt, dass das Cookie in der gesamten Domäne verwendet werden kann.

secure

    secure属性是可选的,而且几乎很少使用。它表示浏览器在把整个cookie发送给服务器时,是否应该使用SLL安全标准。

expires

    每个cookie都有一个失效日期,过期就自动删除了。expires属性要以UTC时间表示。如果没有设置这个属性,cookie的生命期就和当前浏览器会话一样长,会在浏览器关闭时自动删除。

4,编写cookie

    要编写新的cookie,只要把包含所需属性的值赋予document.cookie就可以了:

document.cookie = "username=sam;expires=15/05/2018 00:00:00"

    使用javascript的Date对象可以避免手工输入日期和时间格式;

var cookieDate = new Date(2018,05,15);
document.cookie = "username=sam;expires="+cookieDate.toUTCString();

    这样就能达到和前面一样的结果。

#注意这里使用了cookieDate.toUTCString()函数,而不是cookieDate.toString();这是因为cookie的时间要以UTC格式设置。

    在实际编码时,应该用excape()函数来确保在给cookie赋值时不会有非法字符:

var cookieDate = new Date(2018,05,15);
var user = "Sam Jones";
document.cookie = "username="+excape(user)+";expires="+cookieDate.toUTCString();

5,编写cookie的函数

    很自然就会想到编写一个函数专门用于生成cookie,完成编码和可选属性的组合操作。下面的程序清单就列出了一个这样的程序代码:

function createCookie(name,value,days,path,domain,secure){
	if(days){
		var date = new Date();
		date.setTime(date.getTime()+(days*24*60*60*1000));
		var expires = date.toGMTString();
		}
		else var expires = "";
		cookieString = name + "=" +excape(value);
		if(expires) cookieString += ";expires=" +expires;
		if(path) cookieString += ";path=" + escape(path);
		if(domain) cookieString += ";domain=" + escape(domain);
		if(secure) cookieString += ";secure=" + escape(secure);
		document.cookie = sookieString;
		}

    这个函数的执行的操作是相当直观的,name和value参数组合得到"name = value",其中的value还经过编码以避免非法字符。

    在处理有效期时,使用的参数不是具体日期,而是cookie有效的天数。函数根据这个天数生成有效的日期字符串。

    其他属性都是可选的,如果设置了,就会附加到组成cookie的字符串里。

【推荐学习:javascript高级教程

Das obige ist der detaillierte Inhalt vonSo setzen Sie Cookies in Javascript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn