浏览器缓存

何萌昊

已于 2022-07-28 22:52:55 修改

阅读量769

点赞数

分类专栏：面试文章标签：缓存服务器前端面试

于 2022-07-28 22:48:17 首次发布

本文链接：https://blog.csdn.net/weixin_43715578/article/details/126045605

版权

面试专栏收录该内容

6 篇文章 0 订阅

订阅专栏

什么是浏览器缓存？

浏览器将请求后的资源存储为离线资源，当下次需要该资源时，浏览器会根据缓存机制来决定直接使用缓存资源还是向服务器请求资源
优点：减少不必要的数据的传输，降低服务器的压力。提升客户端的访问速度，从而提升用户的体验

浏览器的缓存过程

强缓存
强缓存就是当我们访问url时，如果本地资源没有过期，就一直从本地读取资源，不会向服务器发送请求

实现方式

第一次访问网站的时候，请求服务器，浏览器会根据响应头判断是否对资源进行缓存，如果响应头中有Expires和Cache-Control则会进行强缓存，
Expires是http1.0协议的字段，它是用来指定资源到期的时间，是服务器端的具体时间点，浏览器会使用它的到期时间和本地时间对比，如果本地时间被修改或者和服务器端的时间差距比较大，那就会造成不准确的问题
Cache-Control是http1.1协议的字段，它使用的是相对时间，解决了Expires的问题，如果两者同时存在，那么Cache-Control的优先级更高
当强缓存失效后，会使用协商缓存，浏览器携带缓存标识（If-Modified-Since和If-None-Match）向服务器发送请求，服务器收到请求，如果发现请求头中含有If-Modified-Since字段，则会根据它的值Last-Modified与服务器上资源最后修改的时间做对比，如果服务器上的资源最后修改的时间大于If-Modified-Since的值，那就会重新返回资源，状态码是200，否则返回状态码304，继续使用缓存文件。
如果服务器发现请求头中含有的是If-None-Match字段，则会根据它的Etag字段值与服务器上该资源的Etag值进行对比，如果一致返回状态码304，代表资源没有更新，继续使用缓存文件，如果不一致就返回新的资源文件，状态码为200
If-Modified-Since和If-None-Match的区别就是If-Modified-Since是根据资源最后修改的时间进行判断是否重新请求新的资源，即使资源内容没有修改修改时间发生变化也会请求服务器的资源，If-None-Match则是根据资源的内容进行判断，如果资源内容没有改变，即使最后修改时间发生变化也不会请求服务器的资源。If-None-Match的优先级更高，如果他们两个同时存在，那只有If-None-Match生效。