强制缓存和协商缓存的再次理解

缓存的优点

减少了冗余的数据传递,节省宽带流量
减少了服务器的负担,大大提高了网站性能
加快了客户端加载网页的速度 这也正是HTTP缓存属于客户端缓存的原因

强制缓存和协商缓存的再次理解
Index属性是用来设置访问静态资源服务器地址的某个文件为localhost:端口号的默认网页,
如果不设置那么就默认是index.html maxAge设置缓存事件

强制缓存

​一般强制缓存是后端设置的,他一般设置一个属性叫cache-control这个属性设为private的意思就是客户端缓存,并且还会设置一个叫max-age的缓存时间,前端首先判断是否设置了客户端缓存的属性,如果有就判断max-age缓存的时间是否过期,如果没有过期,客户端会直接从缓存数据库中获取数据,期间并不发送服务器请求,返回状态码为200(from cache)
强制缓存可以通过以下字段来控制
cache-control:
private:客户端缓存
public:客户端与服务端都可以缓存
max-age=n :缓存内容在n秒后过期
no-cache:需要协商缓存验证数据
no-store:不缓存
expires:
​ 设置服务端返回数据的到期时间,可以被cache-control替代

强制缓存和协商缓存的再次理解

强制缓存和协商缓存的再次理解

协商缓存

又称为 对比缓存,客户端从缓存数据库中获取缓存数据的标识,然后向服务器发送请求,验证该数据是否失效,如果没失效,则服务器返回304,客户端从缓存数据库中读取数据,如果失效,则请求新的数据

协商缓存可以通过以下字段来控制
Last-Modified
服务器响应请求时会告诉浏览器数据最后修改的时间,再次请求时通过时间判断资源是否更新
Etag
服务器响应请求时会通过该字段告诉浏览器当前资源在服务器的唯一标识,当浏览器再次请求时,对比该表示来判断资源是否更新
Etag的计算是使用算法来得出的,而算法会占用服务端计算的资源,所有服务端的资源都是宝贵的,所以就很少使用Etag了

强制缓存和协商缓存的再次理解
强制缓存和协商缓存的再次理解

浏览器的缓存过程

浏览器第一次加载资源,服务器返回200,浏览器将资源文件从服务器上请求下载下来,并把response header及该请求的返回时间一并缓存;
下一次加载资源时,先比较当前时间和上一次返回200时的时间差,如果没有超过cache-control设置的max-age,则没有过期,命中强缓存,不发请求直接从本地缓存读取该文件(如果浏览器不支持HTTP1.1,则用expires判断是否过期);如果时间过期,则向服务器发送header带有If-None-Match和If-Modified-Since的请求;
服务器收到请求后,优先根据Etag的值判断被请求的文件有没有做修改,Etag值一致则没有修改,命中协商缓存,返回304;如果不一致则有改动,直接返回新的资源文件带上新的Etag值并返回200;
如果服务器收到的请求没有Etag值,则将If-Modified-Since和被请求文件的最后修改时间做比对,一致则命中协商缓存,返回304;不一致则返回新的last-modified和文件并返回200;

强制缓存和协商缓存的再次理解
强制缓存和协商缓存的再次理解