49 lines
1.4 KiB
Markdown
49 lines
1.4 KiB
Markdown
|
# 检查更新
|
||
|
|
|
||
|
|
## 介绍
|
||
|
|
|
||
|
|
当网站更新时，你可能会想要检查更新，框架提供了这个能力，通过轮训检查更新，你可以在应用的 `preferences.ts` 文件中配置 `checkUpdatesInterval` 和 `enableCheckUpdates` 字段，用于开启和设置检查更新的时间间隔，单位为`分钟`。
|
||
|
|
|
||
|
|
```ts
|
||
|
|
import { defineOverridesPreferences } from '@vben/preferences';
|
||
|
|
|
||
|
|
export const overridesPreferences = defineOverridesPreferences({
|
||
|
|
// overrides
|
||
|
|
app: {
|
||
|
|
// 是否开启检查更新
|
||
|
|
enableCheckUpdates: true,
|
||
|
|
// 检查更新的时间间隔，单位为分钟
|
||
|
|
checkUpdatesInterval: 1,
|
||
|
|
},
|
||
|
|
});
|
||
|
|
```
|
||
|
|
|
||
|
|
## 效果
|
||
|
|
|
||
|
|
当检测到更新时，会弹出提示框，提示用户是否刷新页面：
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
## 替换为检测
|
||
|
|
|
||
|
|
如果你需要通过其他方式检查更新，比如通过接口，以便更灵活的控制更新的逻辑，可以做到强制刷新、显示更新内容等，你可以通过修改 `@vben/layouts` 下面的 `src/widgets/check-updates/check-updates.vue`文件来实现。
|
||
|
|
|
||
|
|
```ts
|
||
|
|
// 这里可以替换为你的检查更新逻辑
|
||
|
|
async function getVersionTag() {
|
||
|
|
try {
|
||
|
|
const response = await fetch('/', {
|
||
|
|
cache: 'no-cache',
|
||
|
|
method: 'HEAD',
|
||
|
|
});
|
||
|
|
|
||
|
|
return (
|
||
|
|
response.headers.get('etag') || response.headers.get('last-modified')
|
||
|
|
);
|
||
|
|
} catch {
|
||
|
|
console.error('Failed to fetch version tag');
|
||
|
|
return null;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
```
|