W3Cschool
恭喜您成為首批注冊用戶
獲得88經(jīng)驗值獎勵
Cookie 是服務器保存在瀏覽器的一小段文本信息,每個 Cookie 的大小一般不能超過4KB。瀏覽器每次向服務器發(fā)出請求,就會自動附上這段信息。
Cookie 保存以下幾方面的信息。
舉例來說,如果當前URL是www.example.com
,那么Cookie的路徑就是根目錄/
。這意味著,這個Cookie對該域名的根路徑和它的所有子路徑都有效。如果路徑設為/forums
,那么這個Cookie只有在訪問www.example.com/forums
及其子路徑時才有效。
瀏覽器可以設置不接受 Cookie,也可以設置不向服務器發(fā)送 Cookie。window.navigator.cookieEnabled
屬性返回一個布爾值,表示瀏覽器是否打開 Cookie 功能。
document.cookie
屬性返回當前網(wǎng)頁的 Cookie。
// 讀取當前網(wǎng)頁的所有cookie
var allCookies = document.cookie;
由于document.cookie
返回的是分號分隔的所有Cookie,所以必須手動還原,才能取出每一個Cookie的值。
var cookies = document.cookie.split(';');
for (var i = 0; i < cookies.length; i++) {
// cookies[i] name=value形式的單個Cookie
}
document.cookie
屬性是可寫的,可以通過它為當前網(wǎng)站添加Cookie。
document.cookie = 'fontSize=14';
Cookie的值必須寫成key=value
的形式。注意,等號兩邊不能有空格。另外,寫入Cookie的時候,必須對分號、逗號和空格進行轉(zhuǎn)義(它們都不允許作為Cookie的值),這可以用encodeURIComponent
方法達到。
但是,document.cookie
一次只能寫入一個Cookie,而且寫入并不是覆蓋,而是添加。
document.cookie = 'test1=hello';
document.cookie = 'test2=world';
document.cookie
// test1=hello;test2=world
document.cookie
屬性讀寫行為的差異(一次可以讀出全部Cookie,但是只能寫入一個Cookie),與服務器與瀏覽器之間的Cookie通信格式有關。瀏覽器向服務器發(fā)送Cookie的時候,是一行將所有Cookie全部發(fā)送。
GET /sample_page.html HTTP/1.1
Host: www.example.org
Cookie: cookie_name1=cookie_value1; cookie_name2=cookie_value2
Accept: */*
上面的頭信息中,Cookie
字段是瀏覽器向服務器發(fā)送的Cookie。
服務器告訴瀏覽器需要儲存Cookie的時候,則是分行指定。
HTTP/1.0 200 OK
Content-type: text/html
Set-Cookie: cookie_name1=cookie_value1
Set-Cookie: cookie_name2=cookie_value2; expires=Sun, 16 Jul 3567 06:23:41 GMT
上面的頭信息中,Set-Cookie
字段是服務器寫入瀏覽器的Cookie,一行一個。
如果仔細看瀏覽器向服務器發(fā)送的Cookie,就會意識到,Cookie協(xié)議存在問題。對于服務器來說,有兩點是無法知道的。
除了Cookie本身的內(nèi)容,還有一些可選的屬性也是可以寫入的,它們都必須以分號開頭。
Set-Cookie: value[; expires=date][; domain=domain][; path=path][; secure]
上面的Set-Cookie
字段,用分號分隔多個屬性。它們的含義如下。
(1)value屬性
value
屬性是必需的,它是一個鍵值對,用于指定Cookie的值。
(2)expires屬性
expires
屬性用于指定Cookie過期時間。它的格式采用Date.toUTCString()
的格式。
如果不設置該屬性,或者設為null
,Cookie只在當前會話(session)有效,瀏覽器窗口一旦關閉,當前Session結束,該Cookie就會被刪除。
瀏覽器根據(jù)本地時間,決定Cookie是否過期,由于本地時間是不精確的,所以沒有辦法保證Cookie一定會在服務器指定的時間過期。
(3)domain屬性
domain
屬性指定Cookie所在的域名,比如example.com
或.example.com
(這種寫法將對所有子域名生效)、subdomain.example.com
。
如果未指定,默認為設定該Cookie的域名。所指定的域名必須是當前發(fā)送Cookie的域名的一部分,比如當前訪問的域名是example.com
,就不能將其設為google.com
。只有訪問的域名匹配domain屬性,Cookie才會發(fā)送到服務器。
(4)path 屬性
path
屬性用來指定路徑,必須是絕對路徑(比如/
、/mydir
),如果未指定,默認為請求該 Cookie 的網(wǎng)頁路徑。
只有path
屬性匹配向服務器發(fā)送的路徑,Cookie 才會發(fā)送。這里的匹配不是絕對匹配,而是從根路徑開始,只要path
屬性匹配發(fā)送路徑的一部分,就可以發(fā)送。比如,path
屬性等于/blog
,則發(fā)送路徑是/blog
或者/blog/roll
,Cookie都會發(fā)送。path
屬性生效的前提是domain
屬性匹配。
(5)secure 屬性
secure
屬性用來指定Cookie只能在加密協(xié)議HTTPS下發(fā)送到服務器。
該屬性只是一個開關,不需要指定值。如果通信是HTTPS協(xié)議,該開關自動打開。
(6)max-age
max-age
屬性用來指定Cookie有效期,比如60 * 60 * 24 * 365
(即一年31536e3秒)。
(7)HttpOnly
HttpOnly
屬性用于設置該Cookie不能被JavaScript讀取,詳見下文的說明。
以上屬性可以同時設置一個或多個,也沒有次序的要求。如果服務器想改變一個早先設置的Cookie,必須同時滿足四個條件:Cookie的key
、domain
、path
和secure
都匹配。也就是說,如果原始的Cookie是用如下的Set-Cookie
設置的。
Set-Cookie: key1=value1; domain=example.com; path=/blog
改變上面這個cookie的值,就必須使用同樣的Set-Cookie
。
Set-Cookie: key1=value2; domain=example.com; path=/blog
只要有一個屬性不同,就會生成一個全新的Cookie,而不是替換掉原來那個Cookie。
Set-Cookie: key1=value2; domain=example.com; path=/
上面的命令設置了一個全新的同名Cookie,但是path
屬性不一樣。下一次訪問example.com/blog
的時候,瀏覽器將向服務器發(fā)送兩個同名的Cookie。
Cookie: key1=value1; key1=value2
上面代碼的兩個Cookie是同名的,匹配越精確的Cookie排在越前面。
瀏覽器設置這些屬性的寫法如下。
document.cookie = 'fontSize=14; '
+ 'expires=' + someDate.toGMTString() + '; '
+ 'path=/subdirectory; '
+ 'domain=*.example.com';
另外,這些屬性只能用來設置Cookie。一旦設置完成,就沒有辦法讀取這些屬性的值。
刪除一個Cookie的簡便方法,就是設置expires
屬性等于0,或者等于一個過去的日期。
document.cookie = 'fontSize=;expires=Thu, 01-Jan-1970 00:00:01 GMT';
上面代碼中,名為fontSize
的Cookie的值為空,過期時間設為1970年1月1月零點,就等同于刪除了這個Cookie。
瀏覽器對Cookie數(shù)量的限制,規(guī)定不一樣。目前,F(xiàn)irefox是每個域名最多設置50個Cookie,而Safari和Chrome沒有域名數(shù)量的限制。
所有Cookie的累加長度限制為4KB。超過這個長度的Cookie,將被忽略,不會被設置。
由于Cookie可能存在數(shù)量限制,有時為了規(guī)避限制,可以將cookie設置成下面的形式。
name=a=b&c=d&e=f&g=h
上面代碼實際上是設置了一個Cookie,但是這個Cookie內(nèi)部使用&
符號,設置了多部分的內(nèi)容。因此,讀取這個Cookie的時候,就要自行解析,得到多個鍵值對。這樣就規(guī)避了cookie的數(shù)量限制。
瀏覽器的同源政策規(guī)定,兩個網(wǎng)址只要域名相同和端口相同,就可以共享Cookie。
注意,這里不要求協(xié)議相同。也就是說,http://example.com
設置的Cookie,可以被https://example.com
讀取。
設置Cookie的時候,如果服務器加上了HttpOnly
屬性,則這個Cookie無法被JavaScript讀取(即document.cookie
不會返回這個Cookie的值),只用于向服務器發(fā)送。
Set-Cookie: key=value; HttpOnly
上面的這個Cookie將無法用JavaScript獲取。進行AJAX操作時,XMLHttpRequest
對象也無法包括這個Cookie。這主要是為了防止XSS攻擊盜取Cookie。
Copyright©2021 w3cschool編程獅|閩ICP備15016281號-3|閩公網(wǎng)安備35020302033924號
違法和不良信息舉報電話:173-0602-2364|舉報郵箱:jubao@eeedong.com
掃描二維碼
下載編程獅App
編程獅公眾號
聯(lián)系方式:
更多建議: