2. 强缓存和协商缓存

为了减少请求资源的次数，加快资源访问速度。浏览器会对图片、CSS、JS文件等进行缓存。缓存策略分为强缓存和协商缓存

强缓存

强缓存可以理解为强制缓存（服务器目前从不同位置的网页响应请求，但请求者应继续使用原有位置来进行以后的请求，使用本地缓存的话则不会发送请求到服务器，从而达到减轻服务器访问压力的作用，且由于直接从本地缓存读取资源文件，大大提高了加载速度。）

流程

• 浏览器第一次请求远程服务器资源时，如果服务器希望浏览器得到该资源后一段时间内不要再发送请求过来，则服务器可以通过在响应头里设置Cache-Control: max-age=31536000(max-age代表缓存时间，时间为秒)

• 再次请求时，如果是从缓存中取资源的话状态码200后面会表明情况（from disk cache、from memory cache）

一般来说，浏览器会将较大的资源缓存到disk cache，而较小的资源则被缓存到memory cache里。内存缓存与磁盘缓存相比，访问速度要更快一些！

cache-control

cache-control除了max-age外，还可以设置其他值

• no-cache: 不使用强缓存（会使用协商缓存）
• no-store：不使用缓存（不使用强缓存也不使用协商缓存），每次都向服务器发送资源请求。
• private：只允许客户端使用缓存，不允许其他代理服务器进行缓存。
• public：客户端和代理服务器都可缓存。
• s-maxage：与max-age类似，区别是s-maxage是设定代理服务器的缓存时间。

协商缓存

强缓存由浏览器决定是否使用缓存，而协商缓存则是由服务器来告诉浏览器是否使用缓存资源

流程

• 浏览器初次请求资源，服务器返回资源，同时生成一个Etag值携带在响应头里返回给浏览器，当浏览器再次请求资源时会在请求头里携带If-None-Match，值是之前服务器返回的Etag的值，服务器收到之后拿该值与资源文件最新的Etag值做对比。
  • 没发生变化，返回304，告诉浏览器使用缓存
  • 否则返回200和最新的文件给浏览器使用

总结

强缓存优先级大于协商缓存（两者同时存在时，如果强缓存开启且在有效期内，则不会走协商缓存。）