添加版本检查功能
This commit is contained in:
parent
6dd08874a6
commit
824b3ce67c
10
.env
10
.env
@ -1,2 +1,8 @@
|
||||
# 默认环境(开发环境)
|
||||
VITE_NODE_ENV=development
|
||||
# 应用版本号
|
||||
VITE_APP_VERSION=1.0.0
|
||||
|
||||
# 构建时间戳(会在构建时自动更新)
|
||||
VITE_BUILD_TIME=""
|
||||
|
||||
# 是否启用版本检查
|
||||
VITE_ENABLE_VERSION_CHECK=true
|
||||
|
||||
@ -7,6 +7,12 @@
|
||||
<meta name="format-detection" content="telephone=no">
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
|
||||
|
||||
<!-- 禁用缓存 -->
|
||||
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
|
||||
<meta http-equiv="Pragma" content="no-cache">
|
||||
<meta http-equiv="Expires" content="0">
|
||||
|
||||
<title>Likei H5</title>
|
||||
<style>
|
||||
body {
|
||||
|
||||
10
src/main.js
10
src/main.js
@ -1,5 +1,6 @@
|
||||
import './assets/main.css'
|
||||
import { logEnvInfo } from './utils/env.js'
|
||||
import { versionChecker } from './utils/versionChecker.js'
|
||||
|
||||
import { createApp } from 'vue'
|
||||
import App from './App.vue'
|
||||
@ -8,6 +9,15 @@ import router from './router'
|
||||
// 初始化环境信息
|
||||
logEnvInfo()
|
||||
|
||||
// 版本检查
|
||||
if (versionChecker.checkVersion()) {
|
||||
console.log('检测到新版本,正在更新...')
|
||||
// 可以选择显示一个更新提示
|
||||
// if (confirm('检测到新版本,是否立即更新?')) {
|
||||
// versionChecker.forceReload()
|
||||
// }
|
||||
}
|
||||
|
||||
const app = createApp(App)
|
||||
|
||||
app.use(router)
|
||||
|
||||
71
src/utils/versionChecker.js
Normal file
71
src/utils/versionChecker.js
Normal file
@ -0,0 +1,71 @@
|
||||
// 版本检查工具
|
||||
export class VersionChecker {
|
||||
constructor() {
|
||||
this.currentVersion = import.meta.env.VITE_APP_VERSION || Date.now().toString()
|
||||
this.storageKey = 'h5_app_version'
|
||||
}
|
||||
|
||||
// 检查版本更新
|
||||
checkVersion() {
|
||||
const storedVersion = localStorage.getItem(this.storageKey)
|
||||
|
||||
if (storedVersion !== this.currentVersion) {
|
||||
// 版本不匹配,清除缓存并刷新
|
||||
this.clearCache()
|
||||
localStorage.setItem(this.storageKey, this.currentVersion)
|
||||
|
||||
// 延迟刷新,确保缓存清理完成
|
||||
setTimeout(() => {
|
||||
this.forceReload()
|
||||
}, 100)
|
||||
|
||||
return true // 需要刷新
|
||||
}
|
||||
|
||||
return false // 不需要刷新
|
||||
}
|
||||
|
||||
// 清除应用缓存
|
||||
clearCache() {
|
||||
// 清除localStorage(保留必要的数据)
|
||||
const keysToKeep = ['user_token', 'user_info'] // 保留的关键数据
|
||||
const allKeys = Object.keys(localStorage)
|
||||
|
||||
allKeys.forEach(key => {
|
||||
if (!keysToKeep.includes(key)) {
|
||||
localStorage.removeItem(key)
|
||||
}
|
||||
})
|
||||
|
||||
// 清除sessionStorage
|
||||
sessionStorage.clear()
|
||||
|
||||
// 如果支持Service Worker,清除SW缓存
|
||||
if ('serviceWorker' in navigator) {
|
||||
caches.keys().then(names => {
|
||||
names.forEach(name => {
|
||||
caches.delete(name)
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
// 强制刷新页面
|
||||
forceReload() {
|
||||
// 尝试硬刷新(清除缓存)
|
||||
if (window.location.reload) {
|
||||
window.location.reload(true)
|
||||
} else {
|
||||
// 备用方案:重新加载页面
|
||||
window.location.href = window.location.href + '?t=' + Date.now()
|
||||
}
|
||||
}
|
||||
|
||||
// 获取当前版本
|
||||
getCurrentVersion() {
|
||||
return this.currentVersion
|
||||
}
|
||||
}
|
||||
|
||||
// 导出单例
|
||||
export const versionChecker = new VersionChecker()
|
||||
@ -795,7 +795,7 @@ onMounted(async () => {
|
||||
}
|
||||
|
||||
.progress-status {
|
||||
background-color: #3B82F6;
|
||||
background: linear-gradient(to right, #FF7578, #FF3D40);
|
||||
color: white;
|
||||
padding: 4px 12px;
|
||||
border-radius: 12px;
|
||||
|
||||
@ -14,6 +14,24 @@ export default defineConfig({
|
||||
'@': fileURLToPath(new URL('./src', import.meta.url))
|
||||
},
|
||||
},
|
||||
build: {
|
||||
// 生成唯一的文件名,避免缓存问题
|
||||
rollupOptions: {
|
||||
output: {
|
||||
// 为 JS 文件添加时间戳
|
||||
entryFileNames: `js/[name]-[hash]-${Date.now()}.js`,
|
||||
chunkFileNames: `js/[name]-[hash]-${Date.now()}.js`,
|
||||
assetFileNames: (assetInfo) => {
|
||||
const info = assetInfo.name.split('.')
|
||||
const ext = info[info.length - 1]
|
||||
if (/\.(css)$/.test(assetInfo.name)) {
|
||||
return `css/[name]-[hash]-${Date.now()}.[ext]`
|
||||
}
|
||||
return `assets/[name]-[hash]-${Date.now()}.[ext]`
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
server: {
|
||||
host: '0.0.0.0', // 允许外部访问
|
||||
port: 5173, // 指定端口
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user