1. 浏览器行为与 HTTP 协议（粗略）

• 1. 输入网站回车
• 2. 解析域名
• 3. 浏览器发送 HTTP 请求
• 4. 服务端处理请求
• 5. 服务端返回 Html 响应
• 6. 浏览器处理 Html 页面
• 7. 继续请求其他资源

2. 什么是 HTTP 协议

HTTP 协议是超文本协议，从 www 服务器传输到本地浏览器的一种协议，网站是基于 HTTP 协议的，比如网站的图片、CSS、JS 等

3. 网络层相关知识

基础层	事实层
应用层	应用层
表示层	传输层
会话层	网络层
传输层	网络接口层
网络层	物理层
数据链路层
物理层

HTTP 与事实层对应关系

事实层	HTTP 对应关系
应用层	比如 HTTP、FTP、DNS、SMTP 等等
传输层	传输控制协议(TCP)和用户数据层(UDP)
网络层	IP、ICMP
网络接口层	负责键控数据在主机和网咯之间的交换
物理层	与硬件相关

4.HTTP 的工作过程

• 1.首先客户机与服务器先建立连接，比如点击某个超链接
• 2.建立连接以后，客户机发送一个请求给服务器，请求方式为资源标识符（Url），协议版本号，MIME，客户机信息内容等内容
• 3.服务器接到请求后，基于响应信息，其格式为一个状态行，包括协议版本号，状态码，MIME 信息，还有返回的实体内容
• 4.客户端收到请求后处理请求，渲染到显示器上，然后断开连接

如果以上过程中某一步出现错误，那么产生的错误信息会返回到客户端

5.请求方法类型

• get：请求获取 request-url 所标识的资源
• post：在 request-url 所标识的资源后附加数据
• head：请求获取由 request-url 所标识的资源的响应消息头
• put：请求服务器存储一个资源
• delete：请求服务器删除所标识的资源
• trace：请求服务器回送收到的请求信息，主要用于测试或诊断
• connect：http1.1 里预留给能够将连接改为管道方式的代理服务器
• options：请求服务器的性能，或者出现预检请求
• patch：PATCH 请求中的实体保存的是修改资源的指令，该指令指导服务器来对资源做出修改，PATCH 一般用于资源的部分更新，而 PUT 一般用于资源的整体替换

6.HTTP 状态码

• 1xx：提示信息，表示请求已接收，继续处理
• 2xx：成功，表示请求已被成功接收，理解
• 3xx：重定向，要完成请求必须进行更进一步处理
• 4xx：客户端错误，请求语法错误或者请求无法被解析
• 5xx： 服务器错误，服务器未能实现合法的请求

7.常用请求头（Response Headers）

• connection:keep-alive——复用连接，不断开 TCP，一般服务端在性能优化时做到一点一点流返回时，一般带有 keep-alive，或者正常情况下，请求未完成，也带有 keep-alive
• user-agent:识别客户端，里面包含协议、系统信息、浏览器信息、浏览器版本
• Accept：所能接收的格式
• Accept-Econding：数据压缩
• Server:服务器类型
• Accept-Ranges（bytes）:告诉浏览器是字节流
• connect-type:可接受数据类型
• data：日期
• expires:强缓存，GMT 时间，在时间失效前，获取不到修改后的资源
• last-modified：协商缓存，GMT 时间，只要资源修改，无论内容有误变化，都会将资源返回浏览器。已时刻为标识，无法获取一秒内的修改变化。
• status：HTTP 状态码
• cache-control：强缓存，下面具体看
• Etag：校验值，协商缓存

8.HTTP 缓存机制

主要分为强制缓存与协商缓存两种：

强制缓存：状态码：200

• Cache-Control:

Cache-Control	作用
no-store	强制不缓存
no-cache	强制确认
must-revalidate	缓存验证确认，验证状态
public	共有缓存，可以被其他用户共享
private	私有缓存，只能被浏览器缓存
max-age=s	设置过期时间，缓存在 s 秒后失效

• Expires: GMT 时间，时间过期就请求资源，不过期使用缓存‘

协商缓存：状态码 304

• Etag：默认使用 hash 值，精确的判断资源有无修改，可识别一秒内的修改次数
• Last-modified：GMT 时间，只要资源诶修改，无论内容有误变化，都会将资源返回客户端，

下面附有 HTTP 的神图：

当然，浏览器也有自己的缓存策略：

• memory-cache：浏览器强制缓存
• disk-cache：从磁盘中获取资源，等到下次请求，直接从磁盘获取

区别：memoryCache 当退出进程式，内存中的资源将被清空，而磁盘不会被清空，所以当下次再进入该进程时，diskCache 可以直接从磁盘获取资源

9.补充：301，302，预检请求

HTTP 状态返回 301 和 302 的区别

• 301：永久重定向，表示请求的资源已被永久分配了新的 URI。可以简单理解为该资源已经被永久改变了位置
• 302：临时重定向，表示资源被临时改变位置并分配了新的 URI

  区别：

• 301：搜索引擎在抓取新内容的同时将旧的网址替换为重定向后的网址
• 302：搜索引擎会抓取新的内容却保留旧的网址

适用场景：

• 301：域名切换，http 迁移至 https
• 302：用户未登录访问给个人中心，用户 404 跳转首页

预检请求

预检请求是一个跨域请求，用来校验当前跨域请求是否被理解。
预检请求是一个用于校验服务器是否支持当前方法以及是否能够理解当前请求的一种请求，它区别于一般的请求，不由代码发起，而在必要的时候由浏览器自动发出

预检请求触发条件：

• 1.使用了 PUT、DELETE、CONNECT、OPTIONS、TRACE、PATCH 方法
• 2.人为设置了非规定内的其他首部字段，参考上面简单请求的安全字段集合，还要特别注意 Content-Type 的类型
• 3.XMLHttpRequestUpload 对象注册了任何事件监听器
• 4.请求中使用了 ReadableStream 对象

预检请求，如果我们使用的还是 HTTP1，那么预检请求不会被人喜欢，如何关闭预检请求：
设置 Access-Control-Max-Age,如果设置为-1，则表示禁用缓存，每一次请求都要预检请求