纯前端提示页面版本更新
// methods 代码
getHash() {
// 在 js 中请求首页地址不会更新页面
axios.get(`${window.location.origin}${window.location.pathname}?time=${new Date().getTime()}`).then(res=>{
// 返回的是字符串,需要转换为 html
let el = document.createElement('html')
el.innerHTML = res
let spt = el.getElementsByTagName('script')
// 拿到 hash
let new_hash = ""
for (let i = 0; i < spt.length; i++) {
const element = spt[i];
if(spt[i].src.indexOf('checkhash') !== -1){
new_hash = spt[i].src.split('.')[spt[i].src.split('.').length-1]
break;
}
}
if(!this.cur_hash){
this.cur_hash = new_hash
return
}
// iMessage 是个全局变量(默认值 false),用来帮助判断什么时候会弹出提示,不然定时器就一直弹
if (new_hash != this.cur_hash && !this.iMessage) {
// 版本更新,弹出提示
this.iMessage = true
const h = this.$createElement
this.$message.success({
message: h('span', null, [
h('span', null, '当前版本已更新,请刷新后使用 '),
h('a', {
on: {
click: function () {
window.location.reload()
}
},
style:'cursor:pointer;color:rgb(22, 96, 199);border-bottom:1px solid;padding: 2px 0'
}, '刷新页面')
]),
duration: 0,
showClose: true,
customClass:'refresh'
});
}
})
//mounted 代码
// 定时器三分钟分钟查询一次
setInterval(()=>{
this.getHash()
},180000)