Cookie

概述

Cookie 是服务器保存在浏览器的一小段文本信息，每个 Cookie
的大小一般不能超过4KB。浏览器每次向服务器发出请求，就会自动附上这段信息。

Cookie主要用来分辨两个请求是否来自同一客户端，以及用来保存一些状态信息。

不推荐使用Cookie作为客户端存储，Cookie的设计目标并不是这个，它的容量很小，缺乏数据操作接口，而且会影响性能。客户端存储应该使用Webstorage API和IndexedDB。

Cookie包含的信息：

• Cookie的名字
• Cookie的值
• 到期时间
• 所属域名，默认是当前域名
• 生效的路径，默认是当前网址的根路径 /

浏览器的同源政策规定，两个网址只要域名相同和端口相同，就可以共享 Cookie。

Cookie的属性

Expires、Max-Age

1. Expires属性指定一个具体的到期时间，到期后浏览器不再保留这个Cookie，它的值是UTC格式，可以通过Date.prototype.toUTCString()进行格式转换
2. Max-Age属性指定从现在开始Cookie存在的秒数，经过指定秒数后，浏览器不再保留这个Cookie。

注意：

• Max-Age 优先级高于 Expires；
• 如果没有指定这两个属性，那么这个Cookie是Session Cookie，只在本次对话存在，一旦关闭浏览器，浏览器就不会再保留这个Cookie。

Domain、Path

1. Domain属性指定浏览器发出http请求时，哪些域名要附带这个Cookie，不指定时默认为当前URL。
2. Path属性指定浏览器发出http请求时，哪些路径可以附带这个Cookie，只要浏览器发现path属性是http请求路径的开头一部分，就会携带此Cookie。

Secure、HttpOnly

1. Secure属性指定浏览器只有在加密协议https下，才能携带此Cookie。
2. HttpOnly属性指定该Cookie无法通过js脚本（主要是document.cookie、XMLHttpRequest、Request API）拿到，防止该Cookie被脚本读到。

亲测尽管XMLHttpRequest设置了withCredentials = true，也无法携带设置了HttpOnly的Cookie

document.cookie

1. 读，document.cookie会输出当前网页的所有Cookie；
2. 写，document.cookie一次只能写入一个Cookie，写入不是覆盖，而是添加；
3. 删，删除一个现存Cookie的唯一方法，是设置它的expires属性为一个过去的日期。

Cookie与http协议

Cookie由HTTp协议生成，也主要供HTTP协议使用。

http response 生成cookie

服务器如果希望在浏览器保存Cookie，就要在HTTP 回应的头信息里面，放置Set-Cookie字段，可以包含多个Set-Cookie字段。

Set-Cookie: foo=bar; Expires=<date>; HttpOnly;
Set-Cookie: name=fun; Domain=<domain-value>

如果服务器想改变一个早先设置的 Cookie，必须同时满足四个条件：Cookie 的key、domain、path和secure都匹配。举例来说

Set-Cookie: key1=value1; domain=example.com; path=/blog
// 如何改变上面这个Cookie，如下：
Set-Cookie: key1=value2; domain=example.com; path=/blog
// 下面这个设置会生成一个新的Cookie，因为path不一样
Set-Cookie: key1=value2; domain=example.com; path=/

http request 发送cookie

浏览器向服务器发送 HTTP 请求时，每个请求都会带上相应的 Cookie。也就是说，把服务器早前保存在浏览器的这段信息，再发回服务器。这时要使用 HTTP 头信息的Cookie字段。

Cookie: name=value; name2=value;

服务器收到浏览器发来的 Cookie 时，有两点是无法知道的。

Cookie 的各种属性，比如何时过期。
哪个域名设置的 Cookie，到底是一级域名设的，还是某一个二级域名设的。