了解 Cookie

Cookie 是存储在浏览器中的一大块数据,用于保存状态以及网站执行其功能所需的其他信息。

Cookie 是网站存储在用户计算机上的一个小文件,它存储的信息会在浏览器和网站之间来回传输。

每个 Cookie 都是一个键值对,并带有许多控制该 Cookie 使用时间和位置的属性。这些属性用于设置失效日期等,或指示 Cookie 应仅通过 HTTPS 发送。您可以在 HTTP 标头中或通过 JavaScript 界面设置 Cookie。

Cookie 是用于向网站添加持久状态的方法之一。多年来,他们的能力不断提高,但这使得该平台存在一些遗留问题。为解决这一问题,浏览器(包括 Chrome、Firefox 和 Edge)正在改变自身行为,以强制执行可保护隐私的默认设置。

Cookie 实例

假设您有一个博客,想要在其中显示“新变化”推广到 用户。用户可以关闭推广内容,之后他们在一段时间内将不会再看到此推广内容。 您可以将该偏好设置存储在 Cookie 中,并设置为一个月后过期 (2,600,000 秒),并且仅通过 HTTPS 发送。该标头应如下所示: :

Set-Cookie: promo_shown=1; Max-Age=2600000; Secure
<ph type="x-smartling-placeholder">
</ph> 三个 Cookie 在响应中从服务器发送到浏览器
服务器使用 Set-Cookie 标头设置 Cookie。

当读者查看符合这些要求的网页时,他们处于 且该 Cookie 距今还不满一个月 - 他们的浏览器 将在其请求中发送此标头:

Cookie: promo_shown=1
<ph type="x-smartling-placeholder">
</ph> 在一个请求中,有三个 Cookie 从浏览器发送到服务器
您的浏览器会通过 Cookie 标头发回 Cookie。

您也可以使用 document.cookie。向document.cookie分配值会创建或 使用相应键覆盖 Cookie。例如,您可以在 浏览器 JavaScript 控制台:

→ document.cookie = "promo_shown=1; Max-Age=2600000; Secure"
← "promo_shown=1; Max-Age=2600000; Secure"

读取 document.cookie 将输出当前可访问的所有 Cookie 上下文中,每个 Cookie 之间用英文分号分隔:

→ document.cookie;
← "promo_shown=1; color_theme=peachpuff; sidebar_loc=left"
<ph type="x-smartling-placeholder">
</ph> JavaScript 访问浏览器中的 Cookie
JavaScript 可以使用 document.cookie 访问 Cookie。

如果您尝试在精选的热门网站上执行此操作,就会发现大部分内容 他们设置的 Cookie 远远超过三个。在大多数情况下 该域的每个请求都会发送 Cookie,该域有多个 影响。对您来说,上传带宽通常比下载更受限制, 因此所有出站请求的开销都会增加延迟时间 第一个字节。保守的 Cookie 数量和大小。制造商 使用 Max-Age 属性来帮助确保 Cookie 不会挂起 超过实际需要的时间

什么是第一方 Cookie 和第三方 Cookie?

如果您返回到您之前浏览的那些网站选择, 您可能已经注意到了,Cookie 适用于不同的网域, 你正在访问的这个应用与 当前网站(即浏览器地址栏中显示的内容) 用作第一方 Cookie。同样,来自除 称为第三方 Cookie。这不是绝对的 但与用户的上下文相关;同一个 Cookie 可以是 第一方或第三方,具体取决于用户当时所处的网站。

同一网页上的不同请求向浏览器发送三个 Cookie
Cookie 可能来自一个网页上的多个不同网域。

继续上面的示例,假设您的一篇博文中包含 里面有一只特别神奇的猫的照片,它托管在 /blog/img/amazing-cat.png。由于这张图片太惊艳了 直接在其网站上使用如果访问者访问过您的博客 promo_shown Cookie,那么当他们在另一台设备上查看 amazing-cat.png 时 用户的网站,系统将在该图片请求中发送该 Cookie。这个 对任何人来说都不是特别有用,因为 promo_shown 不用于任何用途 只会增加请求的开销。

如果这并非预期效果,您为什么要这么做?就是这样 一种机制,可让网站在 第三方环境中。例如,如果您在自己的网站上嵌入了一个 YouTube 视频,那么 访问者在观看时会看到“稍后观看”选项。如果您的访问者是 已经登录 YouTube,则该会话可通过 使用第三方 Cookie 访问的嵌入式播放器 这意味着“稍后观看”按钮将 只需一次性保存视频即可,无需提示他们登录或 引导用户离开您的页面,然后再返回 YouTube。

同一 Cookie 在三种不同的环境中发送
当访问不同的网页时,系统会发送第三方环境中的 Cookie。

网络的其中一项文化特征是,它通常 默认值。正是由于这个原因,现在有这么多人 自己的内容和应用不过,这也为 安全和隐私问题跨站请求伪造 (CSRF) 攻击依赖于 Cookie 会附加到指定源的任何请求 发起请求的人员例如,如果您访问 evil.example,它就可以 就会触发对 your-blog.example 的请求,您的浏览器将很快附加 关联的 Cookie如果您的博客不谨慎验证这些内容 请求,evil.example 可能会触发诸如删除帖子或添加 自己的内容。

用户也越来越清楚如何使用 Cookie 来跟踪自己的 跨多个网站的活动。但直到现在为止 使用 Cookie 明确说明您的意图。您的 promo_shown Cookie 应该 只能在第一方环境中发送,而微件的会话 Cookie 嵌入其他网站的目的,是为了提供 登录状态。

您可以设置适当的 SameSite 属性,从而使用 Cookie 明确声明您的 intent。

如需识别您的第一方 Cookie 并设置适当的属性,请参阅第一方 Cookie 食谱