HTTP缓存

概念

什么是缓存？

比如当你访问一个新的网址的时候，就要给服务端发送请求，服务端就会把该网址的所有数据（比如css、js、json）返回给你。但是当你再访问该网站的时候，服务器再把这个网址的所有数据返回给你，那这个行为就没有必要了。所以，缓存的作用就是在第一次访问该网址的时候，把数据暂存在本地，当你再次访问的时候，直接在本地缓存读取即可，减少时间和资源的浪费，让页面加载渲染更快。

类别

HTTP缓存有哪些呢？主要分为强制缓存和协商缓存

强制缓存

强制缓存不会向服务器发送请求，直接从本地缓存中读取资源

一、初次访问

浏览器第一次要访问一个网址的时候，它首先会向服务器发送请求，当服务器接成功收到该请求的时候，会返回资源和Cache-Control给浏览器，浏览器完成页面加载和渲染。再服务器响应浏览器的请求之前，服务器会判断该资源是否需要缓存，如果该资源需要缓存，则会通过请求头携带Cache-Control进行强制缓存。

在这里跟大家说一下，cache-control:max-age=31536000（秒）的意思缓存一年

二、再次访问

当浏览器再次访问该网址时，浏览器首先会判断cache-control里面的max-age属性是否过期，意思是说有没有超过缓存的时间，如果没有，本地缓存就会返回数据给浏览器，完成页面的加载与渲染。

强制缓存的作用就是可以初次加载页面以后， 如果服务器的响应头有cache-control，再次访问页面的时候，就不需要再向服务器发送请求，不经过网络，克服网络请求的不稳定性，直接在本地缓存取数据即可。

三、缓存过期

当缓存失效的时候(cache-control的时间到了)，浏览器会向服务器重新发送请求，服务器再返回资源给浏览器。

 在这里给大家补充一下知识点，cache-control有哪些值？

max-age	缓存最大过期的时间
no-catch	不需要强制缓存
no-store	不需要本地缓存且不需要服务端的缓存措施
private	只允许最终用户缓存
public	可允许中间路由或代理作为缓存

协商缓存 

协商缓存回向服务器发送请求，服务端通过判断客户端的资源与服务端的资源是否一样，一致的话返回状态码304，否则返回状态码200和最新的资源

一、运作流程

浏览器想访问一个新的网页，首先会向服务端发送请求，服务端收到请求以后，返回资源和资源标识，这里的资源标识相当于商品的条形码，也就是标记这个资源的一个符号。当浏览器再次请求的时候会带上这个资源标识，服务端就会根据这个标识判断，这个资源是否是当前最新的资源，是的话就返回304，否则返回最新的资源，200状态码和最新的资源标识。

 二、资源标识

刚才已经提到，通过协商缓存，服务端会给浏览器返回一个资源标识，那么资源标识主要通过响应头来携带的，有两种。

1.Last-Modified资源的最后修改时间

2.Etag资源唯一标识(一个字符串，相当于商品的条形码)

 我们来看一下使用协商缓存的资源状况：

 我们由此看见，命中缓存是一个很高效的缓存方式，第二次收到服务器响应的时候，携带的资源容量远远要比第一次小很多。

两者结合起来整个思维导图给大家看看

 页面刷新影响

 最后给大家说说页面刷新对http的影响

刷新方式	操作方式	缓存策略
正常刷新	跳转连接，前进后退	都有效
手动刷新	F5，右击菜单刷新	强缓存失效，协商缓存有效
强刷新	ctrl+F5	都失效

今天你学废了吗？