前端程序员都知道,浏览器的缓存既可以减轻服务器负担,但同时,也给前端人员在编写网站的时候带来诸多不便。
浏览器缓存分为:强缓存和协商缓存
强缓存和协商缓存并不是平行关系,协商缓存是强缓存的基础上增强的缓存功能。今天,这里讨论的是浏览器的强缓存带来问题的解决方案。
强缓存的过程:
第一次请求:浏览器第一次发送请求到服务器,服务器会把response header里加上Expires和Cache-Control:max-age=365000000,这两个请求头中的一个或两个。
然后:浏览器收到响应后,会把这个response header以及响应的资源一起缓存下来。
下一次请求时:浏览器根据这两个请求头的值计算当前时间这个缓存是否过期,如果不过期就直接响应缓存内容而不用向服务器发送请求获取资源。
(Expires,它的值是GMT格式的过期的绝对时间,例如是2019年的6月23日 12:00:00 过期,这样等客户端的时间过了这个时间,这个缓存就会过期。Cache-Control:max-age=365000000,这个请求头的max-age的值是一个时间段,也就是说,它保存的是相对时间,每次请求时,浏览器会用客户端时间减去第一次请求时的时间,大于这个相对时间段,则过期,需要重新请求资源)
为什么使用浏览器强缓存?(即缓存的优点):
-
缓存减少了冗余的数据传输,节约了网络费用
-
缓存缓解了网络瓶颈的问题
-
缓存降低了对原始服务器的要求
-
缓存降低了距离时延