前端 - 关于浏览器缓存html文件

问题描述

问 题

最近在学习浏览器的缓存机制，看到有一种方案，使用强缓存，资源名用文件名+md5来命名，实现资源的更新，对于这个方案有几点疑问：

1. 是否每次修改了资源，都要在html中修改link标签，把url指向最新的资源。这样不会很麻烦吗？尤其是同一个资源被无数html引用的时候（所以会有类似的工具/脚本？）

2. 浏览器也会缓存这个html文件，那么html文件自身如何更新呢？比如我用node写个服务器，可能一句app.use('/', index);就好了，但是每次浏览器也会对html进行缓存，如果用到上述这种方案的话，是否应该在服务器这里做出改动，让所有返回的html文件，都不使用强缓存，这样每次就可以加载到最新修改的html了。（我也查看了几家大网站的F12，有的html就是200，比如百度和网易，新浪这种还是返回的304）

3. 可以讲一讲详细的方案吗。。查看很多资料都是一句资源名+md5命名，每次加载最新的资源，初学者在实现上有些看不懂。。。

解决方案

-> 1, 每次资源更新, HTML 是需要更新的, 这通过代码来完成, 比如 HTML 页面是个模板引擎, md5 文件后缀通过 Webpack 生成, 渲染一下就好.

-> 2, 看具体策略吧. 如果是静态文件, 一般通过 HTTP 协议检查文件的更新时间或者 etag, 不更新返回 304, 更新返回 200. HTML 文件放在服务器, 跟静态资源放在 CDN 生成 200(from cache) 区分开. 如果页面是需要针对每个请求渲染生成, 那一般就是 200 了.

-> 3, 整个过程麻烦地很, 根据业务和工具链还会有变化, 太复杂, 一般人没心情讲. 推荐去把国外的博客看, 比如 https://medium.com/@okonetchn...

这篇关于前端 - 关于浏览器缓存html文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！