手机端检测代码上线更新,提醒用户刷新页面

let url = location.host;
// 给个随机参数,防止接口拿的是本地缓存
url = url + "?temp=" + new Date(); 

// 拿到项目的index.html文件的代码
fetch(url)
	.then(response => {
		if(response.status >=200 && response.status<400) {
			return response;
		}	
	})
	.then(response => {
		// 将index.html文件里的代码字符串化
		return response.text() || "";
	})
	.then(text => {
		// 找到引入index.js的script标签,例如<script type="text/javascript" src="/index.d51b4b4b.js"></script>
		let newHash = (text.match(/<script src='index(.*).js/) || [])[1];
		
		let currentScripts = document.getElementbyTagName("script");
		// 找到引入index.js的script标签
		let currentScript = Array.prototype.find.call(currentScripts, item =>item.src.includes("index"));
		
		if (currentScript && currentScript.src.includes(newHash)) { // 当前hash与新请求的newHash不一样,说明代码已更改上线
			 // 提醒更新页面(即让用户刷新一下页面)
		}
	})
	.catch(err => {
		console.log("err", err);
	})
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值