HTTP 協議中的 cookie

定義

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=123

hello 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…