HTTP缓存与常见面试题精讲，一张图尽在掌握

浏览器第一次向服务器发送请求获取资源，服务器响应报文的状态是200，响应头会带上Cache-Control、Etag字段。浏览器收到响应后会把资源存到本地。当浏览器再次发送请求获取该资源时，浏览器会先检查该资源是否过期（通过Cache-Control:max-age = 时间）。如果资源未过期，浏览器将直接使用本地缓存的资源，而不会向服务器发送请求。如果资源已过期，浏览器会向服务器发送请求，服务器会检查资源是否被修改（通过Etag字段）。如果资源未被修改，服务器将返回304 Not Modified状态码，浏览器将继续使用本地缓存的资源。如果资源已被修改，服务器将返回200 OK状态码，并带上最新的资源，浏览器将用新资源替换本地缓存的资源。

HTTP缓存策略

HTTP缓存策略主要分为强缓存和协商缓存。

强缓存

强缓存是指浏览器在不向服务器发送请求的情况下，直接使用本地缓存的资源。强缓存主要通过Cache-Control字段来控制。Cache-Control字段的值可以是max-age、no-cache、no-store等。

• max-age：指定资源的缓存时间，单位为秒。
• no-cache：指示浏览器在每次请求时都必须向服务器发送请求，以验证资源的有效性。
• no-store：指示浏览器不缓存该资源。

协商缓存

协商缓存是指浏览器在向服务器发送请求时，带上本地缓存资源的一些信息（如Last-Modified或Etag），以便服务器检查资源是否被修改。协商缓存主要通过Last-Modified和Etag字段来控制。

• Last-Modified：表示资源最后修改的时间。
• Etag：表示资源的唯一标识符。

HTTP缓存面试题

1. 什么是HTTP缓存？
2. HTTP缓存的策略有哪些？
3. 强缓存和协商缓存的区别是什么？
4. Cache-Control字段的常用值有哪些？
5. Last-Modified和Etag字段的用途是什么？
6. 如何让浏览器不缓存资源？
7. 如何让浏览器每次都向服务器发送请求？
8. 如何在浏览器中查看缓存的资源？
9. HTTP缓存常见的问题有哪些？
10. HTTP缓存对网站性能的影响是什么？

图表总结

缓存策略	Cache-Control字段	资源过期时间	浏览器行为
强缓存	max-age=时间	资源未过期	直接使用本地缓存的资源
协商缓存	Last-Modified或Etag	资源未被修改	继续使用本地缓存的资源
无缓存	no-cache	每次都向服务器发送请求	不使用本地缓存的资源