谈谈Cookie在客户端和服务的使用

定义

用来给无状态的http请求增添状态标记，供服务端辨识,也称客户端缓存.

---

cookie的结构

• key:cookie的名称
• value:cookie的值
• expires:cookie的失效日期（UTC时间字符串）
• max-age:cookie的失效间隔（秒），优先级高于expires
• path:根据目录限制cookie的分享，如不主动设置，默认为当前页面的路径
• domain:根据域名限制cookie的分享

---

cookie的分类

客户端

可以设置、更改、删除cookie

document.cookie = "name=hezebing;max-age=60";更改或新增cookie,并设置1分钟的有效期
document.cookie = "name=;max-age=-1";//删除key为name的cookie

服务端

也可以设置cookie

//node, express
app.get('/test', function(req, res, next) {
    res.cookie(key,value,{
        maxAge:1000,//毫秒为单位，
        //domain
        //path
        httpOnly:boolean,//设置为true,客户端无法查看、更改,仅作为发送至服务端的凭据
    })
    //不设置表示无期限
    res.cookie(key,value)
})

---

cookie的使用

客户端发送http请求是会携带cookie（凭证）到服务端。

默认携带

• ajax请求（不跨域）
• jsonp请求

需要额外设置

• cors(跨域资源贡献)请求（XMLHttpRequest）：xhr.withCredentials = true;
• fetch请求（fetch接口）credentials:"include";//omit、same-origin
• 服务端也必须设置响应头请求(表示允许客户端的凭证，否则服务端取不到前台发送的cookie)： Access-Control-Allow-Credentials:true

---

注意

• cookie不区分端口号，相同doamin不同端口下同一path的cookie有可能被覆盖
• cookie 有作用域的概念：domain规定主域名、子域名之间cookie的分享，path规定不同目录下的cookie的分享，二者共同绝定了cookie的作用域.

"/index.html" cookie:name=hezebing;path="/"
"/demo/index.html" cookie:sex=female;path="/demo"
"/demo/index.html"可以访问并修改 "/index.html"下的cookie
而"/index.html"无法访问"/demo/index.html"下的cookie