摘要：協(xié)議當(dāng)初為了讓協(xié)議盡量簡(jiǎn)潔，制定為無(wú)狀態(tài)協(xié)議，即指每次請(qǐng)求之前是相互獨(dú)立的，當(dāng)前請(qǐng)求并不會(huì)記錄它的上一次請(qǐng)求信息。其實(shí)是失效日期，必須是格式的時(shí)間可以通過(guò)或者來(lái)獲得。根據(jù)規(guī)范，瀏覽器訪問(wèn)只會(huì)攜帶的，而不會(huì)攜帶的。

HTTP協(xié)議當(dāng)初為了讓協(xié)議盡量簡(jiǎn)潔，制定為無(wú)狀態(tài)協(xié)議，即指每次request請(qǐng)求之前是相互獨(dú)立的，當(dāng)前請(qǐng)求并不會(huì)記錄它的上一次請(qǐng)求信息。那么問(wèn)題來(lái)了，開發(fā)中經(jīng)常需要用到狀態(tài)記錄，比如日常的登錄網(wǎng)站，不可能每次登錄都要客戶重新輸入密碼，這樣用戶體驗(yàn)肯定會(huì)很差，那如何讓無(wú)狀態(tài)的http協(xié)議將狀態(tài)記錄下來(lái)呢？
于是瀏覽器廠商發(fā)明了cookie來(lái)解決這個(gè)難題。
Cookie總是保存在客戶端中，按在客戶端中的存儲(chǔ)位置，可分為內(nèi)存Cookie和硬盤Cookie，設(shè)置了過(guò)期時(shí)間Expires（Cookie的幾個(gè)屬性之一）的Cookie會(huì)存儲(chǔ)在硬盤里面，不同操作系統(tǒng)cookie的儲(chǔ)存路徑會(huì)有所不同，而沒(méi)有設(shè)置該屬性的Cookie會(huì)存儲(chǔ)在內(nèi)存里面，此時(shí)瀏覽器的選項(xiàng)卡可以共享同一個(gè)cookie信息，關(guān)閉瀏覽器就會(huì)清除該Cookie！
首先看一下cookie在前后端交互中的應(yīng)用：

第一次驗(yàn)證成功后，服務(wù)端會(huì)在響應(yīng)頭信息中帶上“set-cookie”字段，瀏覽器監(jiān)測(cè)到該字段之后，會(huì)把其中的值對(duì)號(hào)入座寫入瀏覽器的cookie的屬性中

存儲(chǔ)在cookie中的數(shù)據(jù)，在它過(guò)期之前，每次都會(huì)被瀏覽器自動(dòng)放在http請(qǐng)求中，如果這些數(shù)據(jù)并不是每個(gè)請(qǐng)求都需要發(fā)給服務(wù)端的數(shù)據(jù)，瀏覽器這設(shè)置自動(dòng)處理無(wú)疑增加了網(wǎng)絡(luò)開銷；但如果這些數(shù)據(jù)是每個(gè)請(qǐng)求都需要發(fā)給服務(wù)端的數(shù)據(jù)（比如身份認(rèn)證信息），瀏覽器這設(shè)置自動(dòng)處理就大大免去了重復(fù)添加操作。所以對(duì)于那設(shè)置“每次請(qǐng)求都要攜帶的信息（最典型的就是身份認(rèn)證信息token）”就特別適合放在cookie中。而服務(wù)器端通過(guò)驗(yàn)證cookie中的信息，實(shí)現(xiàn)了驗(yàn)證，也讓瀏覽器端省去了每次都需要輸入登錄信息的麻煩。

為了實(shí)現(xiàn)cookie的作用，除了name和value之外，設(shè)計(jì)者還給它增加了七個(gè)屬性，分別是expires/max-age、domain、path、secure、HttpOnly、samesite，這些屬性是通過(guò)cookie選項(xiàng)來(lái)設(shè)置的，在設(shè)置任一個(gè)cookie時(shí)都可以設(shè)置相關(guān)的這些屬性，當(dāng)然也可以不設(shè)置，這時(shí)會(huì)使用這些屬性的默認(rèn)值。

Expires和Max-Age
expires選項(xiàng)用來(lái)設(shè)置“cookie 什么時(shí)間內(nèi)有效”。expires其實(shí)是cookie失效日期，expires必須是?GMT?格式的時(shí)間（可以通過(guò)new Date().toGMTString()或者?new Date().toUTCString()?來(lái)獲得）。
如expires=Thu, 25 Feb 2016 04:18:00 GMT表示cookie講在2016年2月25日4:18分之后失效，對(duì)于失效的cookie瀏覽器會(huì)清空。如果沒(méi)有設(shè)置該選項(xiàng)，則默認(rèn)有效期為session，即會(huì)話cookie。這種cookie在瀏覽器關(guān)閉后就沒(méi)有了，屬于內(nèi)存cookie。而max-age就是cookie寫入之后的有效時(shí)長(zhǎng)，比如max-age=600就是600秒后，cookie則會(huì)失效。max-age的優(yōu)先級(jí)高于expires

domain 和 path
domain是域名，path是路徑，兩者加起來(lái)就構(gòu)成了 URL，domain和path一起來(lái)限制 cookie 能被哪些 URL 訪問(wèn)，domain屬性的默認(rèn)值是創(chuàng)建cookie的網(wǎng)頁(yè)所在服務(wù)器的主機(jī)名。不能將一個(gè)cookie的域設(shè)置成服務(wù)器所在的域之外的域，要想cookie在多個(gè)二級(jí)域名中共享，需要設(shè)置domain為頂級(jí)域名。

HttpOnly
告知瀏覽器不允許通過(guò)腳本document.cookie去更改這個(gè)值，同樣這個(gè)值在document.cookie中也不可見(jiàn)。但在http請(qǐng)求張仍然會(huì)攜帶這個(gè)cookie。注意這個(gè)值雖然在腳本中不可獲取，但仍然在瀏覽器安裝目錄中以文件形式存在。

secure
安全標(biāo)志，指定后，只有在使用SSL鏈接（https）時(shí)候才能發(fā)送到服務(wù)器，如果是http鏈接則不會(huì)傳遞該信息。就算設(shè)置了secure 屬性也并不代表他人不能看到你機(jī)器本地保存的 cookie 信息，所以不要把重要信息放在cookie中。

samesite
主要為了防御CSRF攻擊（跨站點(diǎn)請(qǐng)求偽造）而添加的cookie屬性，SameSite=Strict嚴(yán)格模式，表明這個(gè) cookie 在任何情況下都不可能作為第三方 cookie，有興趣了解可以查下“csrf攻擊”的資料

除了服務(wù)器端返回的set-cookie字段，瀏覽器端也可以對(duì)cookie進(jìn)行操作，有npm為我們封裝好的插件js-cookie: https://www.npmjs.com/package...，不過(guò)我們還是用原生方法手動(dòng)實(shí)現(xiàn)一遍

獲取cookie：
在控制臺(tái)輸入document.cookie，或者js代碼中console.log(document.cookie)可以得到下圖：

可以看到，cookie是一個(gè)個(gè)鍵值對(duì)（“鍵=值”的形式）加上分號(hào)空格隔開組合而成， 形如： "name1=value1; name2=value2; name3=value3"，可以用正則表達(dá)式來(lái)提取等號(hào)后面的值

function getCookie(name) {
  var value = "; "+ document.cookie;
  var parts = value.split("; " + name + "=");
  if(parts.length === 2) {
    return parts.pop().split(";").shift();
  }
}

寫入cookie

function setCookie (name, value, day) {
  if(day !== 0){     //當(dāng)設(shè)置的時(shí)間等于0時(shí)，不設(shè)置expires屬性，cookie在瀏覽器關(guān)閉后刪除
    var expires = day * 24 * 60 * 60 * 1000
    var date = new Date(+new Date()+expires);
    document.cookie = name + "=" + escape(value) + ";expires=" + date.toUTCString()
  }else{
    document.cookie = name + "=" + escape(value)
  }
}

注意：expires使用GMT或UTC格式的時(shí)間， 我這里沒(méi)有指定路徑(path)和域(domain)， 當(dāng)沒(méi)有指定路徑時(shí)默認(rèn)為當(dāng)前路徑下，如對(duì) 于“https://home.cnblogs.com/u/ma...”下設(shè)置的cookie，其path為"/u/maderlzp"， 其domain為當(dāng)前域名“home.cnblogs.com”

刪除cookie
設(shè)置cookie過(guò)期時(shí)間小于當(dāng)前時(shí)間，那么就會(huì)刪除該cookie

function deleteCookie(name) {
  document.cookie = name + "=;  expires=Thu, 01 Jan 1970 00:00:01 GMT;"
}

Cookie具有不可跨域名性。根據(jù)Cookie規(guī)范，瀏覽器訪問(wèn)Google.com只會(huì)攜帶Google.com的Cookie，而不會(huì)攜帶Baidu.com的Cookie。Google.com也只能操作Google.com的Cookie，而不能操作Baidu.com的Cookie

<完>