强缓存和协商缓存

强缓存

• 如果响应头中包含 Cache-Control 字段，并且值为 max-age=xxx（其中 xxx 表示以秒为单位的缓存时间），或者包含 Expires 字段，并且值表示一个未来的日期时间，则说明使用了强缓存。

协商缓存

• 如果响应头中包含 ETag 字段，则表示服务器返回了资源的标识符，说明使用了协商缓存。
• 如果响应头中包含 Last-Modified 字段，则表示服务器返回了资源的最后修改时间，也是协商缓存的一种。

上图中，Provisional headers are shown. Disable cache to see full headers的警告 实际上并没有发送实际请求到服务器，这个图片资源走的协商缓存

Status Coder: 200 OK （from memory cachel) 内存缓存 （from disk cache）磁盘缓存

如果浏览器自我判断不走本地的缓存并发送了请求，浏览器初次请求资源，服务器返回资源，同时生成一个Etag值携带在响应头里返回给浏览器，当浏览器再次请求资源时会在请求头里携带If-None-Match，值是之前服务器返回的Etag的值，服务器收到之后拿该值与资源文件最新的Etag值做对比

• 如果资源未发生变化，则返回 “304 Not Modified” 响应，浏览器将继续使用缓存的资源。
• 如果资源发生了变化，则返回新的资源内容和一个新的标识符（如 ETag），浏览器将更新缓存。
  

补充下Request Headers 和 Respones Headers 中的常用属性

常用的Respones Headers中的属性

Access-Control-Allow-Origin 可以跨域的源，可写具体的 也可以*表示全部。

Access-Control-Allow-Methods 指定在跨域请求中允许的http方法

Cache-Control 实现缓存机制 具体：https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Headers/Cache-Control

Content-Type 内容类型

Expires 响应过期时间 如果在Cache-Control响应头设置了 “max-age” 或者 “s-max-age” 指令，那么Expires头会被忽略

常用的Request Headers中的属性

Accept 客户端可以处理的内容类型，压缩方式，系统语言等， */*表示任何类型 具体类型
Origin 源 服务器
Accept-Language 可以处理的语言类型
Content-Length 表明请求正文 或者 响应正文中的内容所占字节大小
Content-Type 同Respones
Referer 当前请求页面的来源页面的地址

更多没提到的类型和理解还是参考mdn