持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第29天
点击查看活动详情
一、简述 web 前端 cookie 机制，并结合该机制说明会话保持原理
3. Cookie 的实现原理
Cookie 定义了一些 HTTP 请求头和 HTTP 响应头，通过这些 HTTP 头信息使服务器可以与客户进行状态交互。客户端请求服务器后，如果服务器需要记录用户状态，服务器会在响应信息中包含一个 Set
Cookie 的响应头，客户端会根据这个响应头存储 Cookie 信息。再次请求服务器时，客户端会在请求信息中包含一个 Cookie 请求头，而服务器会根据这个请求头进行用户身份、状态等较验。
下面是一个实现 Cookie 机制的，简单的 HTTP 请求过程：
1）客户端请求服务器
客户端请求 IT 笔录网站首页，请求头如下：
GET / HTTP/1.0
HOST: itbilu.com
2）服务器响应请求
Cookie 是一种 key=value 形式的字符串，服务器需要记录这个客户端请求的状态，因此在响应头中包一个 Set-Cookie 字段。响应头如下：
HTTP/1.0 200 OK
Set-Cookie: UserID=itbilu; Max-Age=3600; Version=1
Content-type: text/html
……
3）再次请求时，客户端请求中会包含一个 Cookie 请求头
客户端会对服务器响应的 Set-Cookie 头信息进行存储。再次请求时，将会在请求头中包含服务器响应的 Cookie 信息。请求头如下
GET / HTTP/1.0
HOST: itbilu.com
Cookie: UserID=itbilu
二、一个页面从输入 URL 到页面加载显示完成，这个过程中都发生了什么
01.浏览器查找域名对应的 IP 地址(DNS 查询：浏览器缓存->系统缓存->路由器缓存->ISP DNS缓存->根域名服务器)
02.浏览器向 Web 服务器发送一个 HTTP 请求（TCP 三次握手）
03.服务器 301 重定向（从 example.com 重定向到 www.example.com）
04.浏览器跟踪重定向地址，请求另一个带 www 的网址
05.服务器处理请求（通过路由读取资源）
06.服务器返回一个 HTTP 响应（报头中把 Content-type 设置为 'text/html'）
07.浏览器进 DOM 树构建
08.浏览器发送请求获取嵌在 HTML 中的资源（如图片、音频、视频、CSS、JS 等）
09.浏览器显示完成页面
10.浏览器发送异步请求
