hookehuyr

新增项目重新部署,页面提示刷新功能

<!--
* @Date: 2023-06-13 13:26:46
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-02-05 19:54:15
* @LastEditTime: 2024-02-06 12:03:24
* @FilePath: /xysBooking/src/App.vue
* @Description: 启动页
-->
......@@ -21,7 +21,8 @@ import { setToastDefaultOptions } from 'vant';
import wx from 'weixin-js-sdk'
import { wxJsAPI } from '@/api/wx/config'
import { apiList } from '@/api/wx/jsApiList.js'
import { Updater } from '@/utils/versionUpdater'
import { showConfirmDialog } from 'vant';
// 使用 include + pinia 状态管理动态缓存页面
const store = mainStore()
const keepPages = computed(() => store.getKeepPages)
......@@ -47,9 +48,34 @@ onMounted(async () => {
wx.showAllNonBaseMenuItem();
});
wx.error((err) => {
console.warn('错误提示', err);
console.warn(err);
});
})
// 正式环境 开启轮询 检查页面是否更新
if (import.meta.env.PROD) {
const upDater = new Updater({
time: 5000
})
upDater.on('no-update', () => {
// console.log('还没更新')
})
upDater.on('update', () => {
// console.log('已经更新了,请刷新页面')
showConfirmDialog({
title: '温馨提示',
message: '系统已经更新,请刷新页面?',
confirmButtonColor: '#A67939',
width: '80vw'
})
.then(() => {
// on confirm
window.location.reload();
})
.catch(() => {
// on cancel
});
})
}
});
</script>
<style lang="less">
......
/*
* @Date: 2023-06-13 13:26:46
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-02-05 21:13:21
* @LastEditTime: 2024-02-06 12:05:22
* @FilePath: /xysBooking/src/route.js
* @Description: 路由列表
*/
......@@ -21,7 +21,7 @@ export default [
},
//路由的独享守卫
beforeEnter: (to,from,next) => {
console.warn(to, from);
// console.warn(to, from);
next();
}
},
......
/*
* @Date: 2024-02-06 11:38:13
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-02-06 12:01:32
* @FilePath: /xysBooking/src/utils/versionUpdater.js
* @Description: 文件描述
*/
/* eslint-disable */
export class Updater {
constructor(options = {}) {
this.oldScript = [];
this.newScript = [];
this.dispatch = {};
this.init(); //初始化
this.timing(options.time); //轮询
}
async init() {
const html = await this.getHtml();
this.oldScript = this.parserScript(html);
}
async getHtml() {
// TAG: html的位置需要动态修改
const html = await fetch(import.meta.env.VITE_BASE).then((res) => res.text()); //读取index html
return html;
}
parserScript(html) {
const reg = new RegExp(/<script(?:\s+[^>]*)?>(.*?)<\/script\s*>/gi); //script正则
return html.match(reg); //匹配script标签
}
//发布订阅通知
on(key, fn) {
(this.dispatch[key] || (this.dispatch[key] = [])).push(fn);
return this;
}
compare(oldArr, newArr) {
const base = oldArr.length;
// 去重
const arr = Array.from(new Set(oldArr.concat(newArr)));
//如果新旧length 一样无更新
if (arr.length === base) {
this.dispatch['no-update'].forEach((fn) => {
fn();
});
} else {
//否则通知更新
this.dispatch['update'].forEach((fn) => {
fn();
});
}
}
timing(time = 10000) {
//轮询
setInterval(async () => {
const newHtml = await this.getHtml();
this.newScript = this.parserScript(newHtml);
this.compare(this.oldScript, this.newScript);
}, time);
}
}