针对浏览器的重复HTTP请求,浏览器和服务器判断是否使用浏览器端文件缓存的过程如下

87 阅读1分钟

1.浏览器会先查询Cache-Control(这里用Expires判断也是可以的,但是Expires一般设置的是绝对过期时间,Cache-Control设置的是相对过期时间)来判断内容是否过期,如果未过期,则直接读取浏览器端缓存文件,不发送HTTP请求,否则进入下一步。

2.在浏览器端判断上次文件返回头中是否含有Etag信息,有则连同If-None-Match一起向服务器发送请求,服务端判断Etag未修改则返回状态304,修改则返回200,否则进入下一步。

3.在浏览器端判断上次文件返回头中是否含有Last-Modified信息,有则连同If-Modified-Since一起向服务器发送请求,服务端判断Last-Modified是否失效,失效则返回200,未失效则返回304。

4.如果Etag和Last-Modified都不存在,直接向服务器请求内容。

HTTP缓存可以在文件缓存生效的情况下让浏览器从本地读取文件,不仅加快了页面资源加载,同时节省网络流量,所以在Web站点配置中要尽可能利用缓存来优化请求过程。在HTML中,我们可以添加中的Expires或Cache-Control来设置,需要注意的是,一般这里Cache-Control设置max-age的时间单位是秒,如果同时设置了Expires和Cache-Control,则只有Cache-Control的设置生效。

微信截图_20221122111125.png