乐趣区

关于前端:cookiecookie的属性及如何操作cookie

cookie
存储在用户本地(硬盘上)。最大 4KB

服务器为了辨认用户(辨别惟一链接)在用户首次拜访页面的时候,客户端向服务端发送申请,服务端返回申请的时候会带上 Set-Cookie 字段,用于给客户端设置一些参数。
当客户端要发送 http 申请时,浏览器会先查看下是否有对应的 cookie。有的话,则主动地增加在 request header 中的 cookie 字段。留神,每一次的 http 申请时,如果有 cookie,浏览器都会主动带上 cookie 发送给服务端。

(用户登录 -> 发送申请(携带账号密码) -> 服务器验证 -> 响应申请(散发认证信息,如 cookie/jwt 等,对 cookie 认证,认证信息能够通过键值对的形式自定义,如设置 ”sid” 为 ”zhangsan”,设置 cookie 的参数,如过期工夫,域名,门路等) -> 浏览器接管申请后,将 cookie 存储在本地 -> 下次在同一域名下发送申请主动携带 cookie)

在服务器端能够对 cookie 的参数进行设置
能够设置的选项包含:

过期工夫 Max-age/expires,域名 domain,门路 path,   httpOnly,secure

过期工夫 Max-age/expires
Max-age 设置这个键值对在浏览器的最长保留工夫。是一个从服务器以后时刻开始的毫秒数。
expires 设置这个键值对的生效时刻。
如果 maxAge 和 expires 都没设置,Cookie 将会在浏览器的会话生效(敞开浏览器时)的时候清空。

Domain
Domain 设置键值对失效的域名,如设置 www.google.com,则只有在拜访 google 这个域名时会携带这条 cookie。

Path
设置键值对失效的 URL 门路,默认设置在根门路上(/),也就是说向以后域名下的所有门路发送申请都能够携带这个 Cookie。

留神:Domain 是域名,Path 是门路,两者加起来就形成了 URL,Domain 和 Path 一起来限度 cookie 能被哪些 URL 拜访。

httpOnly
当 cookie 携带 httpOnly 选项时,客户端(也就是浏览器)无奈通过 js 代码去拜访(包含读取、批改、删除等)这个 cookie。

secure
仅当申请是 HTTPS 协定时,蕴含 secure 选项的 cookie 能力被携带发送至服务器。

上面是一段第一次登陆时,服务器 response 返回 cookie 的展现
“sid=zhangsan; expires=Sat, 12 Sep 2020 02:26:00 GMT; domain=www.google.com; path=/; secure; HttpOnly”

关上浏览器,关上一个网页,查看控制台的 Application -> Storage -> Cooikes 可能看到以后网站所存储的 Cookie

关上网页,控制台输出 document.cookie 能够打印出一段 cookie。(留神: 这个办法只能获取非 HttpOnly 类型的 cookie)

此外,如果通过前端(浏览器)设置 cookie,能够通过执行 document.cookie = “key=name”
document.cookie = “name=lynnshen”;
document.cookie = “age=18”;
(设置多个 cookie 的办法就是反复执行 document.cookie = “key=name”)

同步公布于本人的语雀
https://www.yuque.com/diracke…

退出移动版