跳到主要内容

服务器将Cookie写入浏览器全流程

疑问： 前端访问modao.cc，在服务端设置modao.cc的cookie，将modao.cc的cookie写入浏览器的Application中。这整个流程是怎么发生的？

  1. 浏览器输入modao.cc
  2. DNS解析到正确的ip
  3. 浏览器向ip发送请求，并在请求头中附带已有cookie
  4. 服务器接收到请求
  5. 服务器验证用户身份后，如需设置最新的cookie，在请求的响应头中增加Set-Cookie字段
  6. 服务器发送http响应
  7. 浏览器接收响应，解析响应头，识别出Set-Cookie 指令
  8. 浏览器根据Set-cookie的内容，创建/更新本地cookie
  9. 本地cookie保存在 Chrome 开发者工具的Application > Storage > Cookies中
  10. 浏览器后续请求会自动携带cookie

详细解析，来自AI： 这个流程涉及到前端、网络通信和服务器端的交互。让我为您详细解释这个过程：

  1. 用户通过浏览器访问 modao.cc
    • 用户在浏览器地址栏输入 modao.cc 或点击一个链接。
    • 浏览器解析 URL，进行 DNS 查询以获取 modao.cc 的 IP 地址。
  2. 浏览器发送 HTTP 请求到服务器
    • 浏览器创建一个 HTTP GET 请求（假设是简单的页面访问）。
    • 如果浏览器中已有与 modao.cc 相关的 cookie，会自动将这些 cookie 附加到请求头中。
  3. 服务器接收并处理请求
    • modao.cc 的服务器接收到 HTTP 请求。
    • 服务器处理请求，可能包括：验证用户身份、准备响应数据等。
    • 服务器决定设置新的 cookie 或更新现有的 cookie。
  4. 服务器设置 cookie
    • 服务器在 HTTP 响应头中添加 Set-Cookie 字段。例如：
    • 这个头部指定了 cookie 的名称（session_id）、值（abc123）、所属域、路径、过期时间等属性。
Set-Cookie: session_id=abc123; Domain=modao.cc; Path=/; Expires=Wed, 09 Jun 2024 10:18:14 GMT; HttpOnly; Secure
  1. 服务器发送 HTTP 响应
    • 服务器将包含 Set-Cookie 头和其他必要信息（如 HTML 内容）的 HTTP 响应发送回浏览器。
  2. 浏览器处理响应并存储 cookie
    • 浏览器接收到 HTTP 响应。
    • 浏览器解析响应头，识别出 Set-Cookie 指令。
    • 浏览器根据 Set-Cookie 的内容创建或更新存储在本地的 cookie。
    • 这些 cookie 被存储在浏览器的 cookie 存储区域，可以在开发者工具的 Application 标签中查看。
  3. cookie 存储在浏览器中
    • cookie 被保存在浏览器的特定存储区域。
    • 在 Chrome 开发者工具中，你可以在 Application > Storage > Cookies > https://modao.cc 下看到这些 cookie。
    • cookie 的存储遵循服务器设置的规则，如域、路径、过期时间等。
  4. 后续请求自动携带 cookie
    • 当用户再次访问 modao.cc 或其子域时，浏览器会自动将相关的 cookie 附加到请求头中。

这个过程是自动的，用户通常不会察觉到这些步骤。服务器端设置的 cookie 会被浏览器自动管理和存储，使得网站可以维护用户状态、记住用户偏好等。

需要注意的是，现代浏览器对 cookie 的处理有严格的规则，特别是在安全性和隐私方面。例如，跨站点 cookie 的使用受到限制，某些 cookie 属性（如 SameSite）会影响 cookie 的发送行为。