当我们通过浏览器第一次请求一个网站的时候，我们就会向服务器发起请求，服务器返回相应资源，加入服务器觉得这个资源应该被缓存下来，比如CSS、JS、图片文件等，那么就会响应头里面response-header里面设置一个Cache-Control max-age:31536000，比如这是秒就是一年。
cache-control: max-age=7200, public, immutable浏览器就会把该文件缓存到本地，下次再去请求相同网站，浏览器会检查这个max-age有没有过期，如果没有过期，就不会重新向服务器发起请求，而是从缓存里面拿资源，加载速度就快了，省去了http请求的过程。如果过期，访问网站又会重新请求，服务器重新返回资源。
其实这个Cache-Control是服务器在response-header中返回的，不需要前端做什么。
总结：
在http协议中，可以通过控制http响应头，控制http客户端的资源缓存，分为两大类：强缓存、协商缓存。
强缓存：通过响应头 cache-control 中max-age等指令进行控制。max-age可设置强缓存时间周期，在该周期内，将直接从客户端缓存获取资源，而不会向服务器发送请求。
协商缓存：通过响应头etag和last-modified进行控制，每次发送请求时，需要进行缓存新鲜度校验，如果资源过旧，将直接从服务端获取，否则从客户端本地缓存中获取。
通过请求头if-none-match与响应头etag对比，或者请求头if-modified-since与响应头last-modified进行对比。
扫描二维码关注公众号，回复：
14334524 查看本文章
