浏览器缓存分为强缓存和协商缓存。
强缓存:用户发送的请求,直接从客户端缓存中获取,不发送请求到服务器,不与服务器发送交互行为。
协商缓存:用户发送请求到服务器后,由服务器判定是否从缓存中获取资源。
两者共同点:都会判断缓存是否过期,客户端获得数据最后都是从客户端缓存获得。 两者的区别:强缓存不与服务器进行交互。协商缓存需要询问服务器缓存是否可以使用缓存。
强缓存:有Expires,cache-Control两种。
Expires:是HTTP1.0的协议。
浏览器向服务器发送请求后,服务器会在响应头存储缓存过期时间。浏览器接收到请求后,将这个值存储起来。
第二次发送请求时,会判断缓存过期时间,与主机时间是否相等。如果缓存没有过期,那么从缓存里拿到数据。如果不相等,缓存失效,重新进行缓存。
弊端:本地时间修改会影响过期时间。
cache-Control:是HTTP1.1中的协议
cache-Control是设置相对时间。当第二次发生请求时,浏览器会将上次修改时间与当前时间做比较。如果修改相对时间小于最大缓存时间,那么从缓存里那数据。如果大于最大缓存时间,那么重新拿取数据。(如果有错误,请指出,感谢)
常用属性设置有public,private,no-store(不缓存),no-cache(直接进行协商缓存)
弊端:当打开本地缓存文件时。修改时间会发生改变。影响相对时间判断。
从缓存中加载,状态为200
协商缓存
当缓存过期后,浏览器会与服务器进行协商。询问本地缓存是否可以使用。有两种方式,一种是根据修改时间来进行判断。一种是根据Etag(算法生成的一个标志)
last-modify和if-modified-since
第一次浏览器响应请求时,会存储文件修改时间,浏览器接收到会存储起来。下次发起请求时通过if-modify-since传到服务端进行询问。判断文件是否被修改。
如果没有被修改返回304,如果修改返回200,并且返回响应数据。
弊端:if-modified-since 是以秒为单位。如果一秒内发生多次变化,可能感受不到。
Etag 和 if-none-match
第一次服务器响应请求时,会使用算法生成一个Etag,并且将这个唯一值传给浏览器。浏览器会将Etag存储起来。下次需要获取缓存时,浏览器将Etag的值放入if-none-match中,跟随请求传给服务器。服务器会判断这个值是否被改变。
如果可以用本地缓存,返回304,如果不能使用本地缓存,返回200。
弊端:Etag是由算法生成的,会占内存。