定義

cookie 是存儲在瀏覽器某個文件中的一段key=value字符串

特性

服務端下發響應時，可以在響應頭加上Set-Cookie: key= value，告訴瀏覽器，需要保存哪些cookie

瀏覽器在發送請求時，會將此域下的所有cookie字符串，放在http請求header中的Cookie字段中，隨請求發送給服務端。

因此服務端可以利用cookie的這種性質，保存一些用戶特征。

相關屬性

1.domain

domain 規定這個cookie在哪些域名下有效，默認取當前host作為domain

2.path

path 規定cookie在此domain下的特殊路由下生效，算是一個細分的屬性，一般用不到，默認/，表示全路由生效

3.epires

cookie 的過期時間

• 是一個絕對時間，時間要轉成GMT形式，如果計算機時間大于這個值，瀏覽器就將此cookie刪除。toGMTString()；
• 默認情況下cookie是暫時存在的，他們存儲的值只在瀏覽器會話期間存在，當用戶退出瀏覽器后這些值也會丟失。
• 現在已經被max-age屬性所取代，max-age用秒來設置cookie的生存期

4.HttpOnly

js不能拿到這個cookie值，默認為false

5.secure

它是一個布爾值，指定在網絡上如何傳輸cookie，默認是不安全的，通過一個普通的http連接傳輸

一個完整的cookie寫法：

Set-Cookie: token=d19fb4cac474fe008c16575878215558; Domain=webfem.com; Path=/; Expires=Mon, 17 Jun 2019 13:12:36 GMT; HttpOnly 復制代碼

安全規則

1.cookie只能設置到當前域或者當前域名一級域名下，不能設置到其他域名下。

比如， www.webfem.com 頁面，cookie只能設置到 www.webfem.com （當前域） 或者 .webfem.com（一級域），不能設置到百度 www.baidu.com 域名下去。

2.瀏覽器在發送請求是，只發送域名下的cookie，不會發別的域名下的cookie。

比如， 請求www.webfem.com的請求，只會在header的cookie中帶上domain是 www.webfem.com （當前域） 或者 .webfem.com（一級域）的cookie。不可能帶其他任何domain的cookie。

這兩點都是瀏覽器規定的安全規則。

如何修改

1.在http 的response 頭中設置Set-Cookie字段

現在一般的服務端框架都會封裝setCookie操作，

比如：

// express res.cookie(name, value [, options])// koa ctx.cookies.set(name, value, [options])復制代碼

為了體現本質操作，這里寫個net模塊的應用

require('net').createServer(function(sock) {sock.on('data', function(data) {sock.write('HTTP/1.1 200 OK\r\n');sock.write('Set-Cookie: token=123\r\n')sock.write('\r\n');sock.write('hello world!');sock.destroy();}); }).listen(8080, '127.0.0.1');復制代碼

響應報文

HTTP/1.1 200 OK Set-Cookie: token=123hello world! 復制代碼

2.通過js設置cookie

js操作cookie，只能通過document.cookie屬性獲取，它是一個可讀可寫的屬性。但是設置了http-only 屬性的cookie，這個屬性就取不到了。具體操作如下:

// get cookie。document.cookie 會返回所有cookie組成的字符串 document.cookie;// set cookie。 給 document.cookie 賦值，逐一修改原有cookie，而不會全部覆蓋 document.cookie = 'sessionid=12323;name=space';// 刪除cookie, 原理：cookie 值設為空，過期時間設一個比現在早的時間 document.cookie = `sessionid=;expires=${new Date('1970-01-01'). toUTCString()}` 復制代碼

js 能拿到cookie，這為前端開發帶來的方便，但是，也出現了一些安全隱患，比如通過<script>標簽加載的第三方js，就有可能惡意修改本地cookie，所以設置httpOnly是個很好的習慣。

3.在瀏覽器的開發者工具中設置

以chrome為例，F12 打開開發者工具 -> Application -> Storage -> Cookies。面板如下：

在右側編輯界面，可以輕松設置cookie。注：設置cookie的時候，最好設置個過期時間，不然可能不生效。

原文發布于：webfem.com/post/cookie…

參考文檔： blog.csdn.net/helloliuhai…

總結

以上是生活随笔為你收集整理的HTTP 协议中的 cookie的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。