html引入资源加上时间戳避免缓存

原创于 2022-04-04 16:39:12 发布 · 1.5k 阅读

2 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

前端

本文介绍了在SpringBoot项目中，通过在HTML中为静态资源如JS文件添加时间戳参数来防止浏览器缓存的方法。这种方式能确保每次请求都是最新的资源，避免因缓存导致的页面更新不及时问题。同时推荐了ClearCache浏览器插件用于快速清理缓存，并展示了在验证码接口中应用相同策略的例子，用Math.random()生成随机数防止缓存。

html引入资源加上时间戳避免缓存

发现

最近看 springboot + bootstrap 相关开源项目的时候 , 发现页面引用 js 资源文件的时候 , 末尾都会加上时间戳

在线 renren-security 开源项目

项目地址:

https://gitee.com/renrenio/renren-security

具体代码如下

<script src="${request.contextPath}/statics/config1.js?_${.now?long}"></script>

解释

经过查找资料 , 发现这样做的原因是避免读取缓存文件,

正好我看该项目时候 , 总是因为缓存问题 , 发现页面效果不能及时显示

推荐插件 , 可以快速清理浏览器缓存

Clear Cache

下载网址

https://chrome.zzzmh.cn/#/index

选择推荐下载即可

补充

我们的验证码请求接口其实也是可以使用这种方法 , 防止缓存

我使用的是随机数 , 达到的目的其实是一样的 , 防止页面缓存

具体代码

	//获取验证码的
			getSrc(){
				var  _this = this;
				axios.get("http://localhost:8989/ems_vue/user/getImage?time="+Math.random()).then(res=>{
					_this.url = res.data;

				});
			},