解决部署vue应用后,需手动刷新才能看到修改后的结果
浏览器中打开vue项目之后,发布了新的内容,需要手动F5刷新才能看到内容,然后客户又不想手动刷;看到https://blog.csdn.net/qq_35713752/article/details/102921315这篇文章之后有的想法,用原文的方法,我这儿好像没解决步骤:在/static文件下建立一个json文件,写上你需要的版本号{"version": "1.3"}...
·
浏览器中打开页面之后,发布了新的内容,需要手动F5刷新才能看到内容,然后客户不想重新关了再打开页面,又不想手动刷新;
看到https://blog.csdn.net/qq_35713752/article/details/102921315这篇文章之后有的想法,用原文的方法,我这
儿好像没解决
步骤:
- 在/static文件夹下新建一个json文件,写上你需要的版本号
{
"version": "1.3"
}
- 在App.vue请求刚刚写的json,和localStorage的version比较
methods:{
checkVersion () {
axios.get(`http://xxx.xxx.xxxxx/static/version.json`,{headers: {'Cache-Control': 'no-cache'}}) // 反正就是要请求到json文件的内容, 并且禁止缓存
.then(res => {
const version = res.data.version
const clientVersion = localStorage.getItem('_version_')
console.log('最新版本>>', version)
console.log('当前版本>>', clientVersion)
// 和最新版本不同,刷新页面
if (version !== clientVersion) {
localStorage.setItem('_version_', version)
window.location.reload()
}
})
}
}
- 还是App.vue中,created里面调用
created(){
setInterval(()=>{
this.checkVersion()
}, 60000) // 我这儿1分钟一次
}
更多推荐
已为社区贡献2条内容
所有评论(0)