htmledit_views">
js_content">
点击上方蓝色“架构荟萃”关注我们,输入1024,你懂的
前言
最近发版前端项目,用户经常反馈新添加功能在线上环境不好用,常出现新老页面并存的状况。
经前端同事排查发现,实际上只需要重新刷新一下页面就没事了。但是每次去通知用户肯定不现实。所以需要对前端的 js 和 html" title=css>css 等文件采取一定的缓存失效的措施,强制浏览器重新去服务器获取新的 js 代码以及 html" title=css>css 文件。
楼主经过实际的项目情况反馈,总结以下两点切实可行的办法,分享给大家,希望对大家有帮助。
-
路径后面加时间戳或者随机数的方式
-
采用 hash(md5)重命名文件
路径后面加时间戳或者随机数的方式
时间版本号
如果每次发布,针对修改过的 js 或者 html" title=css>css 文件路径加上时间的版本号,一般以年月日拼写。
<script type="text/html" title=java>javascript" src="lib/common.js?v=20190719"/>
<link rel="stylesheet" type="text/html" title=css>css" href="assets/html" title=css>css/ie/ie8.html" title=css>css?v=20190719" />
如果发生紧急情况,需要在一天当中对某些 html" title=css>css 或者 js 文件多次发版,可以把时间精确到时分秒。
目前楼主主推采用加版本号的方式,因为文件太多,只能做增量修改。好处是没有做任何修改js 或者 html" title=css>css 文件可以不用加版本号。
采用随机数
html" title=java>javascript">document.write('<script src=\".lib/common.js?r=' + Math.random() + "\"" + '><\/script>');
一般不建议用随机数的方式,因为每次刷新页面,随机数都会变化,那么浏览器认为一个新的url 需要重新请求服务端获取 js 或 html" title=css>css 文件,不会在使用浏览器本地缓存。同时占用网络带宽,影响服务器响应速度。
采用 hash(md5)重命名文件
可以利用 gulp-rev 或者 webpack
entry: {
main: './src/common.js',
slove: './src/ie8.js'
},
output: {
filename: '[name].[hash].js',
path: path.resolve(__dirname, 'dist')
}
例如百度搜索首页,就是利用 hash 给 js和 html" title=css>css文件重命名。
推荐阅读
-
月薪8K,html" title=java>java初级程序员需要掌握的一些面试经验
-
基于分布式文件系统 FastDFS,利用 Zuul 网关实现滑块验证登录
-
jsp的10年是谁让它如此落幕?
-
一文读懂阿里大中台、小前台战略
Java 技术经理一枚,头条付费专栏《Spring Cloud Alibaba微服务实战match》作者,擅长微服务&分布式、SpringCloud&SpringBoot、工作流。
后台回复 1024 免费领取微服务、微信小程序、面试等视频资料,扫描上图微信二维码(WooolaDuang)进微信群