Heim > Web-Frontend > js-Tutorial > Hauptteil

Die Welt der Cookies erkunden: Ein Leitfaden für Anfänger

WBOY
Freigeben: 2023-09-03 21:25:02
Original
1239 Leute haben es durchsucht

Die Welt der Cookies erkunden: Ein Leitfaden für Anfänger

Sie haben vielleicht schon von Keksen gehört, aber was genau sind sie genau und was können wir eigentlich damit machen? In diesem Tutorial konzentrieren wir uns auf die Grundlagen von Cookies und verstehen ihre Funktionalität in verschiedenen Webanwendungs- und Website-Umgebungen. Außerdem lernen wir, wie man sie in PHP- und JavaScript-Projekten verwendet, wobei wir besonderes Augenmerk auf Sicherheitsprobleme legen, die bei ihrer Verwendung auftreten können. Nachdem Sie diesen Artikel gelesen haben, verfügen Sie über die Fähigkeiten, die Sie benötigen, um Cookies sicher in Ihren eigenen Webanwendungen zu implementieren.


Schritt 1.Cookies verstehen

Der erste Schritt auf unserer Reise besteht darin, herauszufinden, was diese Kekse eigentlich sind! Auch wenn Sie sie bereits verwendet haben, kann es sein, dass Sie diesen Abschnitt noch nützlich finden – folgen Sie mir also weiter!

Zusammenfassung

Sie können sich Cookies einfach als Textdateien vorstellen, die auf Ihrem Computer gespeichert werden. Auf Anfrage eines Webservers erstellt Ihr Browser eine solche Datei. Danach kann der Netzwerkserver aus dieser Datei lesen oder in sie schreiben. Auch wenn dies wie eine gefährliche Funktion erscheinen mag – schließlich mag es niemand, wenn andere Leute Dateien auf seinen Computer schreiben –, gibt es einige Einschränkungen, um diesen Vorgang so sicher wie möglich zu machen.

  • Webserver können nur auf Cookies zugreifen, die für ihre eigene Domäne festgelegt sind. Die Domäne wird vom Browser festgelegt, wenn der Webserver ein neues Cookie anfordert, und kann nur die Domäne oder Subdomäne des Webservers sein (der Webserver kann bei Bedarf eine Subdomäne auswählen). Das bedeutet, dass mozilla.com die von google.com usw. gesetzten Cookies nicht lesen kann und umgekehrt.
  • Laut HTTP-Protokoll darf jedes Cookie nicht größer als 4096 Byte (4 KB) sein.
  • Die Anzahl der Cookies pro Domain ist begrenzt. Die Anzahl variiert je nach Browser, eine häufig verwendete Grenze liegt jedoch bei 20 Cookies. Dadurch soll verhindert werden, dass eine einzelne Domäne Speicherplatz auf dem Client beansprucht.
  • Die Gesamtzahl der Cookies auf der Festplatte des Kunden ist begrenzt. Auch diese Zahl variiert je nach Browser, ist aber in der Regel auf etwa dreihundert begrenzt. Bei Überschreitung dieser Anzahl werden alte Cookies gelöscht und neue erstellt.

Cookies haben ein Ablaufdatum. Dieses Datum wird festgelegt, damit Browser alte Cookies löschen können, wenn der Webserver sie nicht mehr benötigt. Wenn das Ablaufdatum leer ist, wird das Cookie gelöscht, wenn die Verbindung zum Server geschlossen wird. Dies geschieht, wenn der Benutzer ein Fenster oder eine Registerkarte der Website schließt oder wenn der Benutzer den gesamten Browser schließt. Diese Cookies, manchmal auch Session-Cookies genannt, dienen in erster Linie der Speicherung temporärer Einstellungen.

Technologie

Mal sehen, wie diese Dinge auf technischer Ebene aussehen. Die Übertragung von Cookies erfolgt über das HTTP-Protokoll. Dies ist das Protokoll, das von Browsern verwendet wird, um Dateien abzurufen und an den Server zu senden. Nach der Anforderung eines Cookies wird das Cookie jedes Mal an den Server gesendet, wenn der Browser ein neues Element auf der Webseite abruft. Unten sehen wir ein Fragment des Servers, der ein neues Cookie anfordert (dieses Fragment ist Teil der HTTP-Antwort).

Set-Cookie: Name=content data; expires=Fri, 31-Dec-2010 23:59:59 GMT; path=/; domain=.example.net
Nach dem Login kopieren

Haben Sie jetzt keine Angst, es ist alles leicht zu verstehen!

  • Set-Cookie: teilt dem Browser mit, dass der Server ein neues Cookie erstellen möchte.
  • Name ist der Name des Cookies. Jedes Cookie innerhalb der Domain muss einen anderen Namen haben, damit der Browser alle Cookies getrennt halten kann. Auf den Namen folgt =content-data, wobei „content-data“ die Daten sind, die in das Cookie aufgenommen werden sollen. Diese Daten können eine Textzeichenfolge oder eine Zahl sein und, wie oben erwähnt, bis zu 4 KB groß sein.
  • expires= ist der Befehl für das Ablaufdatum. Das Ablaufdatum hat das Format „Wdy,DD-Mo-YYYY HH:MM:SS GMT“ (fragen Sie mich nicht, warum es in diesem lächerlichen Format definiert ist, denn ich weiß es auch nicht. Kein Benutzer hat jemals eines gesehen Ablaufdatum, warum dann Speicher, Festplattenspeicher und Bandbreite bei langen Terminen verschwenden?) Machen Sie sich jedoch keine Sorgen, denn die meisten Programmiersprachen verfügen über benutzerfreundliche Funktionen. Browser löschen automatisch Cookies, deren Ablaufdatum überschritten ist.
  • Domänen und Pfade bedürfen einer tieferen Erklärung. Domain ist die Domain, in der das Cookie aktiv sein wird. Wenn die Domain „ads.google.com“ ist, wird das Cookie nur an Server für diese Domain gesendet. Wenn die Domain „google.com“ ist, wird das Cookie an jeden Server für jede Subdomain dieser Domain gesendet. Google, einschließlich google.com selbst.
  • Path ist der Pfad zur Domain, an die das Cookie gesendet wird. Das heißt, wenn der Pfad auf „/images/“ und die Domain auf „ads.google.com“ eingestellt ist, wird das Cookie nur dann an den Server gesendet, wenn der Browser eine Datei von „ads.google“ anfordert. com/images/ '. Wenn der Pfad auf „/“ gesetzt ist, wird das Cookie unabhängig vom Speicherort der angeforderten Datei auf dem Server an den Server gesendet.

Im nächsten Schritt werden wir untersuchen, wie diese Eigenschaften in Programmiersprachen verwendet werden.


Schritt 2. So erstellen und lesen Sie Cookies

Cookies können auf viele Arten erstellt werden. In diesem Tutorial konzentrieren wir uns jedoch auf PHP und JavaScript.

PHP

在 PHP 中创建 cookie 时要记住的最重要的事情是,您必须在向浏览器发送任何数据之前设置所有 cookie。这意味着您应该始终任何输出之前初始化新的cookie。这包括 echo() 或 print() 命令以及 或 标记。当然,也有一些例外,但这是一般的经验法则。

<?php
/***Creating a cookie***/
$name = 'clientname';
$value = 'Peter Griffin';
//time() gives current time in seconds, and we add 60 seconds * 30 = 30 minutes
//so this cookie expires in 30 minutes.
//You may notice that the expire date is in seconds, PHP translates this to
//the correct format internally!
$expireDate = time() + 60 * 30;
$path = '/example/';
$domain = 'test.envato.com';
$secure = false; //only transmit the cookie if a HTTPS connection is established
$httponly = true; //make cookie available only for the HTTP protocol (and not for JavaScript)
setcookie( $name, $value, $expireDate, $path, $domain, $secure, $httponly);

<html>
.... //all content etc goes here
?>
Nach dem Login kopieren

除了 $secure$httponly 之外,现在看起来应该很熟悉。 “secure”是强制仅在已建立 HTTPS 连接的情况下发送 cookie,如果设置为 true,则通常应设置为 false。 “httponly”使 cookie 只能通过 HTTP 协议使用,这意味着客户端语言(如 JavaScript 和 VBscript)无法访问 cookie。这有助于防止令人讨厌的事情,例如跨站点脚本,如果您无意使用 JavaScript 等语言编辑客户端的 cookie,则应将其设置为 true。另外,为了防止误解,“httponly”并不意味着 cookie 不能通过 HTTPS 发送,因为事实上它们仍然可以。但是,请注意,上面的代码片段可以变得非常小(并且应该如此):

<?php
setcookie( 'clientname', 'Peter Griffin', time()+60*30, '/example/', 'test.envato.com', false,true);
?>
Nach dem Login kopieren

太棒了!现在我们可以创建cookie,但我们也必须能够读取它们。幸运的是,一旦创建了 cookie,PHP 就可以让这一切变得非常简单。在 PHP 中,有一个名为 $_COOKIE[] 的环境变量,可用于提取 cookie 的值。要使用它,只需将 cookie 的名称插入方括号 [] 内,如下所示:

<?php
$cookieValue = $_COOKIE['name of the cookie'];
?>
Nach dem Login kopieren

这个环境变量可以像其他环境变量一样使用。就像 $_GET[] 和 $_POST[] 一样,如果您愿意,可以直接将其视为普通变量(当然,一旦您检查了 cookie 是否确实存在)。

如果您想更改过期日期、路径或域,则必须使用与原始 cookie 相同的名称,使用 setcookie() 覆盖现有 cookie。如果您将过期日期更改为过去的日期(例如 time()-30*60),则 Cookie 将被删除。

JavaScript

Cookie 也可以在客户端读取和写入。尽管 JavaScript 没有提供一个很好的读取和写入 cookie 的解决方案,但它是可能的并且被广泛使用。 JavaScript 使用 document.cookie 对象进行 cookie 操作,如以下代码片段所示:

//get current date
var expiredate = new Date();
//increase date by 5 hours
expiredate.setHours( expiredate.getHours() + 5);
document.cookie = 'cookiename=cookievalue; expires='  + expiredate.toUTCString() + 'path=/example/; domain=test.envato.com';
Nach dem Login kopieren

您可能已经注意到,此语法与 HTTP 协议表示法非常相似。这样做的优点是更容易控制,但也带来了一些潜在的问题。下面是读取 cookie 的 片段。

var cookieName = 'testcookiename';
var textArray = document.cookie.split(';'); //put all the parts of the string in an array
for(var i = 0; i < textArray.length; i++){ // loop though all string pieces
var textPiece = textArray[i]; //contains 1 string piece
 //filter beginning spaces
while(textPiece(0)==' ') textPiece = textPiece.substring(1,textPiece.length);
//if the textpiece contains our cookies name
if (textPiece.indexOf(cookieName)== 0){ 
 //return whats after the cookies name
return textPiece.substring(cookieName.length,c.length);
}
}
Nach dem Login kopieren

我知道,我知道;这是一种痛苦。对你们来说幸运的是,我在下面发布了一些预先编写的函数(不过,出于学习目的,您可能想创建自己的函数,而且您应该这样做!)。

function writeCookie(cookieName, cookieValue, expireHours, path, domain){
var date =  new Date();
date.setHours(date.getHours + expireHours);
document.cookie = cookieName + '=' + cookieValue + '; expires=' + date + '; path=' + path + '; domain=' + domain;
}

function readCookie(cookieName){
var textArray = document.cookie.split(';');
for(var i = 0; i < textArray.length; i++){
var textPiece = textArray[i]; 
while(textPiece(0)==' ') textPiece = textPiece.substring(1,textPiece.length);
if (textPiece.indexOf(cookieName)== 0) return textPiece.substring(cookieName.length,c.length);
}
}
Nach dem Login kopieren

请记住,这些片段不包含任何错误检查。


第 3 步. 如何处理 Cookie

你知道吗? -

Cookie 是由 Netscape 发明的,该公司希望使用它们为在线商店创建购物车。多亏了 cookie,人们即使在与商店断开连接后也能够保留购物车中的商品。

如今,我们几乎将 Cookie 用于您能想到的所有用途。您可以使用它们来保存用户设置,例如名称、语言、位置或屏幕尺寸。这可以提高您想要为客户提供的服务质量,因为您可以优化为客户提供的服务,并在将来记住这种优化。例如,您可以将客户的首选语言保存到 cookie,然后在客户每次访问您的网站时以首选语言显示您网站的内容。

当然,用cookie还有很多比这更有趣的事情!在下一步中,我将向您展示一个很酷的代码片段示例。


第 4 步。 编写很酷的东西

终于!现在我们可以开始编写一些很棒的代码了!下面是一个奖励片段,它使用 cookie 创建重新登录机制。

“记住我”登录片段

在我们开始之前,此片段包含一些 MySQL 代码。如果您不熟悉 MySQL,请不要惊慌。尽管这段代码有点困难,但只要有一些基本的 PHP 和 cookie 知识就应该可以理解。

要创建“记住我”的实现,我们必须具备一些条件。首先,我们需要一个包含用户名、密码和标识字段的数据库表。其次,我们需要一个唯一的字符串或数字来通过cookie安全地识别客户端(这是数据库表中的标识)。在此代码片段中,我们将使用 SHA-1 摘要(它只是一个字符串)作为标识符。如果使用得当,这可以提供出色的安全性。

大多数人只是在 cookie 中插入用户名和密码,然后自动将其发送到服务器。 应始终避免这种情况!Cookie 通常通过非安全连接发送,因此任何潜在攻击者很容易看到内容。

<?php

//this assumes that the user has just logged in
/****Creating an identification string****/

$username; //normally the username would be known after login

//create a digest from two random values and the username
$digest = sha1(strval(rand(0,microtime(true)) + $username + strval(microtime(true)); 

//save to database (assuming connection is already made)
mysql_query('UPDATE users SET reloginDigest="'.$digest.'" WHERE username="'.$username.'"');  

//set the cookie
setcookie( 'reloginID', $digest, time()+60*60*24*7,'/', 'test.example.com', false, true); 


//this assumes that the user is logged out and cookie is set
/****Verifying users through the cookie****/

$digest = $_COOKIE['reloginID'];
$digest = mysql_real_escape_string($digest); //filter any malicious content

//check database for digest
$result = mysql_query('SELECT username FROM users WHERE reloginDigest="'.$digest.'"');
//check if a digest was found
if(mysql_num_rows($result) == 1){
	$userdata  = mysql_fetch_object($result);
	$username = $userdata->username;

	//here you should set a new digest for the next relogin using the above code!

	echo 'You have successfully logged in, '.$username;

} else{
//digest didn't exist (or more of the same digests were found, but that's not going to happen)
echo "failed to login!";
}

?>
Nach dem Login kopieren

通过像我们一样使用摘要,获得两个相同摘要的机会微乎其微。摘要是一个四十个字符串,理论上,如果输入发生更改,它应该始终提供完整的随机输出。实际上,您应该在服务器端代码中添加时间限制,以便摘要在 X 分钟后无效。这可以防止攻击者复制某人的 cookie 并使用它们登录。


第 5 步。最佳实践

本教程即将结束。作为结论,我想总结一些最佳实践:

  • 切勿将敏感数据插入 cookie。客户可能会在公共计算机上浏览,因此不要留下任何个人信息。
  • 永远不要相信来自 Cookie 的数据。始终过滤字符串和数字!攻击者可能会向 Cookie 写入恶意数据,以执行您不希望服务执行的操作。
  • 尝试估计 cookie 的有效期限,并相应地设置到期日期。您不想让客户的计算机被设置为一百年后过期的旧 cookie 占用。
  • 始终设置 secure 和 httponly 以满足您的应用程序需求。如果您的应用程序不使用 JavaScript 编辑 cookie,请启用 httponly。如果您始终有 HTTPS 连接,请启用安全。这提高了数据的完整性和机密性。

结论

我希望您从今天的 Nettuts+ 教程中学到了一些东西。如果您有任何疑问,请随时发表评论或在 Twitter 上打个招呼。

Das obige ist der detaillierte Inhalt vonDie Welt der Cookies erkunden: Ein Leitfaden für Anfänger. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage