feat(update): 重构自动更新系统，使用 electron-updater 替代手动下载

- CI 构建 macOS 拆分为 x64/arm64 分别构建，合并 latest-mac.yml
- 主进程使用 electron-updater 管理检查、下载、安装全流程
- 渲染进程 UpdateModal 改为响应式同步主进程更新状态
- IPC 通道统一为 app-update:* 系列
- 窗口拦截外部链接在系统浏览器打开
- 新增 5 语言更新相关国际化文案

.github/workflows/build.yml

@@ -6,12 +6,25 @@ on:
       - 'v*'
 
 jobs:
-  release:
+  build:
     runs-on: ${{ matrix.os }}
 
     strategy:
+      fail-fast: false
       matrix:
-        os: [macos-latest, windows-latest, ubuntu-latest]
+        include:
+          - id: mac-x64
+            os: macos-latest
+            build_command: npm run build:mac:x64
+          - id: mac-arm64
+            os: macos-latest
+            build_command: npm run build:mac:arm64
+          - id: windows
+            os: windows-latest
+            build_command: npm run build:win
+          - id: linux
+            os: ubuntu-latest
+            build_command: npm run build:linux
 
     steps:
       - name: Check out Git repository
@@ -21,68 +34,82 @@ jobs:
         uses: actions/setup-node@v4
         with:
           node-version: 18
+          cache: npm
 
-      - name: Install Dependencies
+      - name: Install dependencies
-        run: npm install
+        run: npm ci
 
-      # MacOS Build
+      - name: Install Linux build dependencies
-      - name: Build MacOS
-        if: matrix.os == 'macos-latest'
-        run: |
-          export ELECTRON_BUILDER_EXTRA_ARGS="--universal"
-          npm run build:mac
-        env:
-          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          CSC_IDENTITY_AUTO_DISCOVERY: false
-          DEBUG: electron-builder
-
-      # Windows Build
-      - name: Build Windows
-        if: matrix.os == 'windows-latest'
-        run: npm run build:win
-        env:
-          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-
-      # Linux Build
-      - name: Build Linux
         if: matrix.os == 'ubuntu-latest'
         run: |
           sudo apt-get update
           sudo apt-get install -y libgtk-3-dev webkit2gtk-4.0 libappindicator3-dev librsvg2-dev patchelf
-          npm run build:linux
+
+      - name: Build artifacts
+        run: ${{ matrix.build_command }}
         env:
-          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          CSC_IDENTITY_AUTO_DISCOVERY: false
 
-      # Get version from tag
+      - name: Prepare mac update metadata
-      - name: Get version from tag
+        if: startsWith(matrix.id, 'mac-')
-        id: get_version
+        run: rm -f dist/latest-mac.yml
-        run: echo "VERSION=${GITHUB_REF#refs/tags/v}" >> $GITHUB_ENV
-        shell: bash
 
-      # Read release notes
+      - name: Upload release bundle
-      - name: Read release notes
+        uses: actions/upload-artifact@v4
-        id: release_notes
-        run: |
-          NOTES=$(awk "/## \[v${{ env.VERSION }}\]/{p=1;print;next} /## \[v/{p=0}p" CHANGELOG.md)
-          echo "NOTES<<EOF" >> $GITHUB_ENV
-          echo "$NOTES" >> $GITHUB_ENV
-          echo "EOF" >> $GITHUB_ENV
-        shell: bash
-
-      # Upload artifacts
-      - name: Upload artifacts
-        uses: softprops/action-gh-release@v1
         with:
-          files: |
+          name: ${{ matrix.id }}
+          if-no-files-found: error
+          path: |
             dist/*.dmg
+            dist/*.zip
             dist/*.exe
             dist/*.deb
             dist/*.rpm
             dist/*.AppImage
             dist/latest*.yml
             dist/*.blockmap
+
+  release:
+    needs: build
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Check out Git repository
+        uses: actions/checkout@v4
+
+      - name: Get version from tag
+        run: echo "VERSION=${GITHUB_REF#refs/tags/v}" >> $GITHUB_ENV
+
+      - name: Read release notes
+        run: |
+          NOTES=$(awk "/## \[v${{ env.VERSION }}\]/{p=1;print;next} /## \[v/{p=0}p" CHANGELOG.md)
+          echo "NOTES<<EOF" >> $GITHUB_ENV
+          echo "$NOTES" >> $GITHUB_ENV
+          echo "EOF" >> $GITHUB_ENV
+
+      - name: Download build artifacts
+        uses: actions/download-artifact@v4
+        with:
+          path: release-artifacts
+
+      - name: Prepare release files
+        run: |
+          mkdir -p release-upload
+          find release-artifacts -type f \
+            ! -name 'latest-mac-x64.yml' \
+            ! -name 'latest-mac-arm64.yml' \
+            -exec cp {} release-upload/ \;
+          node scripts/merge_latest_mac_yml.mjs \
+            release-artifacts/mac-x64/latest-mac-x64.yml \
+            release-artifacts/mac-arm64/latest-mac-arm64.yml \
+            release-upload/latest-mac.yml
+
+      - name: Publish GitHub Release
+        uses: softprops/action-gh-release@v2
+        with:
           body: ${{ env.NOTES }}
           draft: false
           prerelease: false
+          files: release-upload/*
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

package.json

@@ -19,9 +19,11 @@
     "build": "electron-vite build",
     "postinstall": "electron-builder install-app-deps",
     "build:unpack": "npm run build && electron-builder --dir",
-    "build:win": "npm run build && electron-builder --win",
+    "build:win": "npm run build && electron-builder --win --publish never",
-    "build:mac": "npm run build && electron-builder --mac",
+    "build:mac": "npm run build && electron-builder --mac --x64 --publish never && cp dist/latest-mac.yml dist/latest-mac-x64.yml && electron-builder --mac --arm64 --publish never && cp dist/latest-mac.yml dist/latest-mac-arm64.yml && node scripts/merge_latest_mac_yml.mjs dist/latest-mac-x64.yml dist/latest-mac-arm64.yml dist/latest-mac.yml",
-    "build:linux": "npm run build && electron-builder --linux"
+    "build:mac:x64": "npm run build && electron-builder --mac --x64 --publish never && cp dist/latest-mac.yml dist/latest-mac-x64.yml",
+    "build:mac:arm64": "npm run build && electron-builder --mac --arm64 --publish never && cp dist/latest-mac.yml dist/latest-mac-arm64.yml",
+    "build:linux": "npm run build && electron-builder --linux --publish never"
   },
   "lint-staged": {
     "*.{ts,tsx,vue,js}": [
@@ -136,12 +138,8 @@
     "mac": {
       "icon": "resources/icon.icns",
       "target": [
-        {
+        "dmg",
-          "target": "dmg",
+        "zip"
-          "arch": [
-            "universal"
-          ]
-        }
       ],
       "artifactName": "${productName}-${version}-mac-${arch}.${ext}",
       "darkModeSupport": true,

scripts/merge_latest_mac_yml.mjs

@@ -0,0 +1,119 @@
+import { mkdirSync, readFileSync, writeFileSync } from 'node:fs';
+import { dirname } from 'node:path';
+
+function readScalar(line, prefix) {
+  return line.slice(prefix.length).trim().replace(/^'/, '').replace(/'$/, '');
+}
+
+function parseLatestMacYml(filePath) {
+  const content = readFileSync(filePath, 'utf8');
+  const lines = content.split(/\r?\n/);
+  const result = {
+    version: '',
+    files: [],
+    path: '',
+    sha512: '',
+    releaseDate: ''
+  };
+
+  let currentFile = null;
+
+  for (const line of lines) {
+    if (!line.trim()) {
+      continue;
+    }
+
+    if (line.startsWith('version: ')) {
+      result.version = readScalar(line, 'version: ');
+      continue;
+    }
+
+    if (line.startsWith('path: ')) {
+      result.path = readScalar(line, 'path: ');
+      continue;
+    }
+
+    if (line.startsWith('sha512: ')) {
+      result.sha512 = readScalar(line, 'sha512: ');
+      continue;
+    }
+
+    if (line.startsWith('releaseDate: ')) {
+      result.releaseDate = readScalar(line, 'releaseDate: ');
+      continue;
+    }
+
+    if (line.startsWith('  - url: ')) {
+      currentFile = {
+        url: readScalar(line, '  - url: ')
+      };
+      result.files.push(currentFile);
+      continue;
+    }
+
+    if (line.startsWith('    sha512: ') && currentFile) {
+      currentFile.sha512 = readScalar(line, '    sha512: ');
+      continue;
+    }
+
+    if (line.startsWith('    size: ') && currentFile) {
+      currentFile.size = Number.parseInt(readScalar(line, '    size: '), 10);
+    }
+  }
+
+  return result;
+}
+
+function uniqueFiles(files) {
+  const fileMap = new Map();
+
+  for (const file of files) {
+    fileMap.set(file.url, file);
+  }
+
+  return Array.from(fileMap.values());
+}
+
+function stringifyLatestMacYml(data) {
+  const lines = [`version: ${data.version}`, 'files:'];
+
+  for (const file of data.files) {
+    lines.push(`  - url: ${file.url}`);
+    lines.push(`    sha512: ${file.sha512}`);
+    lines.push(`    size: ${file.size}`);
+  }
+
+  lines.push(`path: ${data.path}`);
+  lines.push(`sha512: ${data.sha512}`);
+  lines.push(`releaseDate: '${data.releaseDate}'`);
+
+  return `${lines.join('\n')}\n`;
+}
+
+const [x64Path, arm64Path, outputPath] = process.argv.slice(2);
+
+if (!x64Path || !arm64Path || !outputPath) {
+  console.error(
+    'Usage: node scripts/merge_latest_mac_yml.mjs <latest-mac-x64.yml> <latest-mac-arm64.yml> <output.yml>'
+  );
+  process.exit(1);
+}
+
+const x64Data = parseLatestMacYml(x64Path);
+const arm64Data = parseLatestMacYml(arm64Path);
+
+if (x64Data.version !== arm64Data.version) {
+  console.error(
+    `Version mismatch between mac update files: ${x64Data.version} !== ${arm64Data.version}`
+  );
+  process.exit(1);
+}
+
+const mergedData = {
+  ...x64Data,
+  files: uniqueFiles([...x64Data.files, ...arm64Data.files]),
+  releaseDate: arm64Data.releaseDate || x64Data.releaseDate
+};
+
+mkdirSync(dirname(outputPath), { recursive: true });
+writeFileSync(outputPath, stringifyLatestMacYml(mergedData), 'utf8');

src/i18n/lang/en-US/comp.ts

@@ -37,11 +37,17 @@ export default {
     title: 'New version found',
     currentVersion: 'Current version',
     cancel: 'Do not update',
+    checking: 'Checking for updates...',
     prepareDownload: 'Preparing to download...',
     downloading: 'Downloading...',
+    readyToInstall: 'The update package is ready to install',
     nowUpdate: 'Update now',
     downloadFailed: 'Download failed, please try again or download manually',
     startFailed: 'Start download failed, please try again or download manually',
+    autoUpdateFailed: 'Automatic update failed',
+    openOfficialSite: 'Open official download page',
+    manualFallbackHint:
+      'If automatic update fails, you can download the latest version from the official release page.',
     noDownloadUrl:
       'No suitable installation package found for the current system, please download manually',
     installConfirmTitle: 'Install Update',

src/i18n/lang/en-US/settings.ts

@@ -277,6 +277,7 @@ export default {
     latest: 'Already latest version',
     hasUpdate: 'New version available',
     gotoUpdate: 'Go to Update',
+    manualUpdate: 'Manual Update',
     gotoGithub: 'Go to Github',
     author: 'Author',
     authorDesc: 'algerkong Give a star🌟',

src/i18n/lang/ja-JP/comp.ts

@@ -37,11 +37,17 @@ export default {
     title: '新しいバージョンが見つかりました',
     currentVersion: '現在のバージョン',
     cancel: '後で更新',
+    checking: '更新を確認中...',
     prepareDownload: 'ダウンロード準備中...',
     downloading: 'ダウンロード中...',
+    readyToInstall: '更新パッケージのダウンロードが完了しました。今すぐインストールできます',
     nowUpdate: '今すぐ更新',
     downloadFailed: 'ダウンロードに失敗しました。再試行するか手動でダウンロードしてください',
     startFailed: 'ダウンロードの開始に失敗しました。再試行するか手動でダウンロードしてください',
+    autoUpdateFailed: '自動更新に失敗しました',
+    openOfficialSite: '公式サイトから更新',
+    manualFallbackHint:
+      '自動更新に失敗した場合は、公式リリースページから最新版をダウンロードできます。',
     noDownloadUrl:
       '現在のシステムに適したインストールパッケージが見つかりません。手動でダウンロードしてください',
     installConfirmTitle: '更新をインストール',

src/i18n/lang/ja-JP/settings.ts

@@ -276,6 +276,7 @@ export default {
     latest: '現在最新バージョンです',
     hasUpdate: '新しいバージョンが見つかりました',
     gotoUpdate: '更新へ',
+    manualUpdate: '手動更新',
     gotoGithub: 'Githubへ',
     author: '作者',
     authorDesc: 'algerkong スターを付けてください🌟',

src/i18n/lang/ko-KR/comp.ts

@@ -37,11 +37,17 @@ export default {
     title: '새 버전 발견',
     currentVersion: '현재 버전',
     cancel: '나중에 업데이트',
+    checking: '업데이트 확인 중...',
     prepareDownload: '다운로드 준비 중...',
     downloading: '다운로드 중...',
+    readyToInstall: '업데이트 패키지 다운로드가 완료되었습니다. 지금 설치할 수 있습니다',
     nowUpdate: '지금 업데이트',
     downloadFailed: '다운로드 실패, 다시 시도하거나 수동으로 다운로드해주세요',
     startFailed: '다운로드 시작 실패, 다시 시도하거나 수동으로 다운로드해주세요',
+    autoUpdateFailed: '자동 업데이트에 실패했습니다',
+    openOfficialSite: '공식 페이지에서 업데이트',
+    manualFallbackHint:
+      '자동 업데이트에 실패하면 공식 릴리스 페이지에서 최신 버전을 다운로드할 수 있습니다.',
     noDownloadUrl: '현재 시스템에 적합한 설치 패키지를 찾을 수 없습니다. 수동으로 다운로드해주세요',
     installConfirmTitle: '업데이트 설치',
     installConfirmContent: '앱을 닫고 업데이트를 설치하시겠습니까?',

src/i18n/lang/ko-KR/settings.ts

@@ -277,6 +277,7 @@ export default {
     latest: '현재 최신 버전입니다',
     hasUpdate: '새 버전 발견',
     gotoUpdate: '업데이트하러 가기',
+    manualUpdate: '수동 업데이트',
     gotoGithub: 'Github로 이동',
     author: '작성자',
     authorDesc: 'algerkong 별점🌟 부탁드려요',

src/i18n/lang/zh-CN/comp.ts

@@ -37,11 +37,16 @@ export default {
     title: '发现新版本',
     currentVersion: '当前版本',
     cancel: '暂不更新',
+    checking: '检查更新中...',
     prepareDownload: '准备下载...',
     downloading: '下载中...',
+    readyToInstall: '更新包已下载完成，可以立即安装',
     nowUpdate: '立即更新',
     downloadFailed: '下载失败，请重试或手动下载',
     startFailed: '启动下载失败，请重试或手动下载',
+    autoUpdateFailed: '自动更新失败',
+    openOfficialSite: '前往官网更新',
+    manualFallbackHint: '自动更新失败后，可前往官网下载安装最新版本。',
     noDownloadUrl: '未找到适合当前系统的安装包，请手动下载',
     installConfirmTitle: '安装更新',
     installConfirmContent: '是否关闭应用并安装更新？',

src/i18n/lang/zh-CN/settings.ts

@@ -273,6 +273,7 @@ export default {
     latest: '当前已是最新版本',
     hasUpdate: '发现新版本',
     gotoUpdate: '前往更新',
+    manualUpdate: '官网更新',
     gotoGithub: '前往 Github',
     author: '作者',
     authorDesc: 'algerkong 点个star🌟呗',

src/i18n/lang/zh-Hant/comp.ts

@@ -37,11 +37,16 @@ export default {
     title: '發現新版本',
     currentVersion: '目前版本',
     cancel: '暫不更新',
+    checking: '檢查更新中...',
     prepareDownload: '準備下載...',
     downloading: '下載中...',
+    readyToInstall: '更新包已下載完成，可以立即安裝',
     nowUpdate: '立即更新',
     downloadFailed: '下載失敗，請重試或手動下載',
     startFailed: '啟動下載失敗，請重試或手動下載',
+    autoUpdateFailed: '自動更新失敗',
+    openOfficialSite: '前往官網更新',
+    manualFallbackHint: '自動更新失敗後，可前往官網下載安裝最新版本。',
     noDownloadUrl: '未找到適合目前系統的安裝包，請手動下載',
     installConfirmTitle: '安裝更新',
     installConfirmContent: '是否關閉應用程式並安裝更新？',

src/i18n/lang/zh-Hant/settings.ts

@@ -269,6 +269,7 @@ export default {
     latest: '目前已是最新版本',
     hasUpdate: '發現新版本',
     gotoUpdate: '前往更新',
+    manualUpdate: '官網更新',
     gotoGithub: '前往 Github',
     author: '作者',
     authorDesc: 'algerkong 點個star🌟呗',

src/main/modules/update.ts

@@ -1,101 +1,296 @@
-import axios from 'axios';
+import { app, BrowserWindow, ipcMain, shell } from 'electron';
-import { spawn } from 'child_process';
+import electronUpdater, {
-import { app, BrowserWindow, ipcMain } from 'electron';
+  type ProgressInfo,
-import * as fs from 'fs';
+  type UpdateDownloadedEvent,
-import * as path from 'path';
+  type UpdateInfo
+} from 'electron-updater';
 
-export function setupUpdateHandlers(_mainWindow: BrowserWindow) {
+import {
-  ipcMain.on('start-download', async (event, url: string) => {
+  APP_UPDATE_RELEASE_URL,
+  APP_UPDATE_STATUS,
+  type AppUpdateState,
+  createDefaultAppUpdateState
+} from '../../shared/appUpdate';
+
+const { autoUpdater } = electronUpdater;
+
+type CheckUpdateOptions = {
+  manual?: boolean;
+};
+
+let updateState: AppUpdateState = createDefaultAppUpdateState(app.getVersion());
+let isInitialized = false;
+let checkForUpdatesPromise: Promise<AppUpdateState> | null = null;
+let downloadUpdatePromise: Promise<AppUpdateState> | null = null;
+
+const isAutoUpdateSupported = (): boolean => {
+  // if (!app.isPackaged) {
+  //   return false;
+  // }
+
+  if (process.platform === 'linux') {
+    return Boolean(process.env.APPIMAGE);
+  }
+
+  return true;
+};
+
+const normalizeReleaseNotes = (releaseNotes: UpdateInfo['releaseNotes']): string => {
+  if (typeof releaseNotes === 'string') {
+    return releaseNotes;
+  }
+
+  if (Array.isArray(releaseNotes)) {
+    return releaseNotes
+      .map((item) => {
+        const version = item.version ? `## ${item.version}` : '';
+        return [version, item.note].filter(Boolean).join('\n');
+      })
+      .join('\n\n');
+  }
+
+  return '';
+};
+
+const broadcastUpdateState = () => {
+  for (const window of BrowserWindow.getAllWindows()) {
+    window.webContents.send('app-update:state', updateState);
+  }
+};
+
+const setUpdateState = (partial: Partial<AppUpdateState>) => {
+  updateState = {
+    ...updateState,
+    ...partial
+  };
+  broadcastUpdateState();
+};
+
+const resetUpdateState = () => {
+  updateState = {
+    ...createDefaultAppUpdateState(app.getVersion()),
+    supported: isAutoUpdateSupported()
+  };
+};
+
+const getUnsupportedMessage = () => {
+  if (!app.isPackaged) {
+    return '当前环境为开发模式，自动更新仅在打包后的应用内可用';
+  }
+
+  if (process.platform === 'linux') {
+    return '当前 Linux 安装方式不支持自动更新，请前往官网下载安装包更新';
+  }
+
+  return '当前环境不支持自动更新，请前往官网下载安装包更新';
+};
+
+const applyUpdateInfo = (
+  status: AppUpdateState['status'],
+  info?: Pick<UpdateInfo, 'version' | 'releaseDate' | 'releaseNotes'>
+) => {
+  setUpdateState({
+    status,
+    availableVersion: info?.version ?? null,
+    releaseDate: info?.releaseDate ?? null,
+    releaseNotes: info ? normalizeReleaseNotes(info.releaseNotes) : '',
+    releasePageUrl: APP_UPDATE_RELEASE_URL,
+    errorMessage: null,
+    checkedAt: Date.now()
+  });
+};
+
+const checkForUpdates = async (options: CheckUpdateOptions = {}): Promise<AppUpdateState> => {
+  if (!updateState.supported) {
+    const errorMessage = options.manual ? getUnsupportedMessage() : null;
+    setUpdateState({
+      status: options.manual ? APP_UPDATE_STATUS.error : APP_UPDATE_STATUS.idle,
+      errorMessage
+    });
+    return updateState;
+  }
+
+  if (
+    updateState.status === APP_UPDATE_STATUS.available ||
+    updateState.status === APP_UPDATE_STATUS.downloading ||
+    updateState.status === APP_UPDATE_STATUS.downloaded
+  ) {
+    return updateState;
+  }
+
+  if (checkForUpdatesPromise) {
+    return await checkForUpdatesPromise;
+  }
+
+  checkForUpdatesPromise = (async () => {
     try {
-      const response = await axios({
+      setUpdateState({
-        url,
+        status: APP_UPDATE_STATUS.checking,
-        method: 'GET',
+        errorMessage: null,
-        responseType: 'stream',
+        checkedAt: Date.now()
-        onDownloadProgress: (progressEvent: { loaded: number; total?: number }) => {
-          if (!progressEvent.total) return;
-          const percent = Math.round((progressEvent.loaded / progressEvent.total) * 100);
-          const downloaded = (progressEvent.loaded / 1024 / 1024).toFixed(2);
-          const total = (progressEvent.total / 1024 / 1024).toFixed(2);
-          event.sender.send('download-progress', percent, `已下载 ${downloaded}MB / ${total}MB`);
-        }
-      });
-
-      const fileName = url.split('/').pop() || 'update.exe';
-      const downloadPath = path.join(app.getPath('downloads'), fileName);
-
-      // 创建写入流
-      const writer = fs.createWriteStream(downloadPath);
-
-      // 将响应流写入文件
-      response.data.pipe(writer);
-
-      // 处理写入完成
-      writer.on('finish', () => {
-        event.sender.send('download-complete', true, downloadPath);
-      });
-
-      // 处理写入错误
-      writer.on('error', (error) => {
-        console.error('Write file error:', error);
-        event.sender.send('download-complete', false, '');
       });
+      await autoUpdater.checkForUpdates();
+      return updateState;
     } catch (error) {
-      console.error('Download failed:', error);
+      const errorMessage = error instanceof Error ? error.message : '检查更新失败';
-      event.sender.send('download-complete', false, '');
+      setUpdateState({
+        status: APP_UPDATE_STATUS.error,
+        errorMessage,
+        checkedAt: Date.now()
+      });
+      return updateState;
+    } finally {
+      checkForUpdatesPromise = null;
     }
+  })();
+
+  return await checkForUpdatesPromise;
+};
+
+const downloadUpdate = async (): Promise<AppUpdateState> => {
+  if (!updateState.supported) {
+    setUpdateState({
+      status: APP_UPDATE_STATUS.error,
+      errorMessage: getUnsupportedMessage()
+    });
+    return updateState;
+  }
+
+  if (updateState.status === APP_UPDATE_STATUS.downloaded) {
+    return updateState;
+  }
+
+  if (!hasDownloadableUpdate()) {
+    setUpdateState({
+      status: APP_UPDATE_STATUS.error,
+      errorMessage: '当前没有可下载的更新'
+    });
+    return updateState;
+  }
+
+  if (downloadUpdatePromise) {
+    return await downloadUpdatePromise;
+  }
+
+  downloadUpdatePromise = (async () => {
+    try {
+      await autoUpdater.downloadUpdate();
+      return updateState;
+    } catch (error) {
+      const errorMessage = error instanceof Error ? error.message : '下载更新失败';
+      setUpdateState({
+        status: APP_UPDATE_STATUS.error,
+        errorMessage
+      });
+      return updateState;
+    } finally {
+      downloadUpdatePromise = null;
+    }
+  })();
+
+  return await downloadUpdatePromise;
+};
+
+const hasDownloadableUpdate = () => {
+  return updateState.status === APP_UPDATE_STATUS.available;
+};
+
+const openReleasePage = async (): Promise<boolean> => {
+  await shell.openExternal(updateState.releasePageUrl || APP_UPDATE_RELEASE_URL);
+  return true;
+};
+
+export function setupUpdateHandlers(mainWindow: BrowserWindow) {
+  if (isInitialized) {
+    mainWindow.webContents.once('did-finish-load', () => {
+      mainWindow.webContents.send('app-update:state', updateState);
+    });
+    return;
+  }
+
+  isInitialized = true;
+  resetUpdateState();
+
+  autoUpdater.autoDownload = false;
+  autoUpdater.autoInstallOnAppQuit = true;
+
+  autoUpdater.on('checking-for-update', () => {
+    setUpdateState({
+      status: APP_UPDATE_STATUS.checking,
+      errorMessage: null,
+      checkedAt: Date.now()
+    });
   });
 
-  ipcMain.on('install-update', (_event, filePath: string) => {
+  autoUpdater.on('update-available', (info) => {
-    if (!fs.existsSync(filePath)) {
+    applyUpdateInfo(APP_UPDATE_STATUS.available, info);
-      console.error('Installation file not found:', filePath);
+  });
-      return;
-    }
 
-    const { platform } = process;
+  autoUpdater.on('update-not-available', () => {
+    setUpdateState({
+      status: APP_UPDATE_STATUS.notAvailable,
+      availableVersion: null,
+      releaseNotes: '',
+      releaseDate: null,
+      errorMessage: null,
+      checkedAt: Date.now()
+    });
+  });
 
-    // 先启动安装程序，再退出应用
+  autoUpdater.on('download-progress', (progress: ProgressInfo) => {
-    try {
+    setUpdateState({
-      if (platform === 'win32') {
+      status: APP_UPDATE_STATUS.downloading,
-        // 使用spawn替代exec，并使用detached选项确保子进程独立运行
+      downloadProgress: progress.percent,
-        const child = spawn(filePath, [], {
+      downloadedBytes: progress.transferred,
-          detached: true,
+      totalBytes: progress.total,
-          stdio: 'ignore'
+      bytesPerSecond: progress.bytesPerSecond,
-        });
+      errorMessage: null
-        child.unref();
+    });
-      } else if (platform === 'darwin') {
+  });
-        // 挂载 DMG 文件
-        const child = spawn('open', [filePath], {
-          detached: true,
-          stdio: 'ignore'
-        });
-        child.unref();
-      } else if (platform === 'linux') {
-        const ext = path.extname(filePath);
-        if (ext === '.AppImage') {
-          // 先添加执行权限
-          fs.chmodSync(filePath, '755');
-          const child = spawn(filePath, [], {
-            detached: true,
-            stdio: 'ignore'
-          });
-          child.unref();
-        } else if (ext === '.deb') {
-          const child = spawn('pkexec', ['dpkg', '-i', filePath], {
-            detached: true,
-            stdio: 'ignore'
-          });
-          child.unref();
-        }
-      }
 
-      // 给安装程序一点时间启动
+  autoUpdater.on('update-downloaded', (info: UpdateDownloadedEvent) => {
-      setTimeout(() => {
+    setUpdateState({
-        app.quit();
+      status: APP_UPDATE_STATUS.downloaded,
-      }, 500);
+      availableVersion: info.version,
-    } catch (error) {
+      releaseNotes: normalizeReleaseNotes(info.releaseNotes),
-      console.error('启动安装程序失败:', error);
+      releaseDate: info.releaseDate,
-      // 尽管出错，仍然尝试退出应用
+      downloadProgress: 100,
-      app.quit();
+      downloadedBytes: info.files.reduce((total, file) => total + (file.size ?? 0), 0),
-    }
+      totalBytes: info.files.reduce((total, file) => total + (file.size ?? 0), 0),
+      bytesPerSecond: 0,
+      errorMessage: null
+    });
+  });
+
+  autoUpdater.on('error', (error) => {
+    setUpdateState({
+      status: APP_UPDATE_STATUS.error,
+      errorMessage: error?.message ?? '自动更新失败'
+    });
+  });
+
+  ipcMain.handle('app-update:get-state', async () => {
+    return updateState;
+  });
+
+  ipcMain.handle('app-update:check', async (_event, options?: CheckUpdateOptions) => {
+    return await checkForUpdates(options);
+  });
+
+  ipcMain.handle('app-update:download', async () => {
+    return await downloadUpdate();
+  });
+
+  ipcMain.handle('app-update:quit-and-install', async () => {
+    autoUpdater.quitAndInstall(false, true);
+    return true;
+  });
+
+  ipcMain.handle('app-update:open-release-page', async () => {
+    return await openReleasePage();
+  });
+
+  mainWindow.webContents.once('did-finish-load', () => {
+    mainWindow.webContents.send('app-update:state', updateState);
   });
 }

src/main/modules/window.ts

@@ -317,6 +317,42 @@ export function createMainWindow(icon: Electron.NativeImage): BrowserWindow {
   // 创建窗口
   const mainWindow = new BrowserWindow(options);
 
+  const appOrigin = (() => {
+    if (!is.dev || !process.env.ELECTRON_RENDERER_URL) return null;
+    try {
+      return new URL(process.env.ELECTRON_RENDERER_URL).origin;
+    } catch {
+      return null;
+    }
+  })();
+
+  const shouldOpenInBrowser = (targetUrl: string): boolean => {
+    try {
+      const parsedUrl = new URL(targetUrl);
+      if (parsedUrl.protocol === 'mailto:' || parsedUrl.protocol === 'tel:') {
+        return true;
+      }
+
+      if (parsedUrl.protocol !== 'http:' && parsedUrl.protocol !== 'https:') {
+        return false;
+      }
+
+      if (appOrigin && parsedUrl.origin === appOrigin) {
+        return false;
+      }
+
+      return true;
+    } catch {
+      return false;
+    }
+  };
+
+  const openInSystemBrowser = (targetUrl: string) => {
+    shell.openExternal(targetUrl).catch((error) => {
+      console.error('打开外部链接失败:', targetUrl, error);
+    });
+  };
+
   // 移除菜单
   mainWindow.removeMenu();
 
@@ -380,8 +416,16 @@ export function createMainWindow(icon: Electron.NativeImage): BrowserWindow {
     }, 100);
   });
 
+  mainWindow.webContents.on('will-navigate', (event, targetUrl) => {
+    if (!shouldOpenInBrowser(targetUrl)) return;
+    event.preventDefault();
+    openInSystemBrowser(targetUrl);
+  });
+
   mainWindow.webContents.setWindowOpenHandler((details) => {
-    shell.openExternal(details.url);
+    if (shouldOpenInBrowser(details.url)) {
+      openInSystemBrowser(details.url);
+    }
     return { action: 'deny' };
   });
 

src/preload/index.d.ts

@@ -1,5 +1,7 @@
 import { ElectronAPI } from '@electron-toolkit/preload';
 
+import type { AppUpdateState } from '../shared/appUpdate';
+
 interface API {
   minimize: () => void;
   maximize: () => void;
@@ -17,11 +19,14 @@ interface API {
   sendSong: (data: any) => void;
   unblockMusic: (id: number, data: any, enabledSources?: string[]) => Promise<any>;
   onLyricWindowClosed: (callback: () => void) => void;
-  startDownload: (url: string) => void;
+  getAppUpdateState: () => Promise<AppUpdateState>;
-  onDownloadProgress: (callback: (progress: number, status: string) => void) => void;
+  checkAppUpdate: (manual?: boolean) => Promise<AppUpdateState>;
-  onDownloadComplete: (callback: (success: boolean, filePath: string) => void) => void;
+  downloadAppUpdate: () => Promise<AppUpdateState>;
+  installAppUpdate: () => Promise<boolean>;
+  openAppUpdatePage: () => Promise<boolean>;
+  onAppUpdateState: (callback: (state: AppUpdateState) => void) => void;
+  removeAppUpdateListeners: () => void;
   onLanguageChanged: (callback: (locale: string) => void) => void;
-  removeDownloadListeners: () => void;
   importCustomApiPlugin: () => Promise<{ name: string; content: string } | null>;
   importLxMusicScript: () => Promise<{ name: string; content: string } | null>;
   invoke: (channel: string, ...args: any[]) => Promise<any>;

src/preload/index.ts

@@ -2,6 +2,8 @@ import { electronAPI } from '@electron-toolkit/preload';
 import type { IpcRendererEvent } from 'electron';
 import { contextBridge, ipcRenderer } from 'electron';
 
+import type { AppUpdateState } from '../shared/appUpdate';
+
 // Custom APIs for renderer
 const api = {
   minimize: () => ipcRenderer.send('minimize-window'),
@@ -26,13 +28,17 @@ const api = {
   onLyricWindowClosed: (callback: () => void) => {
     ipcRenderer.on('lyric-window-closed', () => callback());
   },
-  // 更新相关
+  getAppUpdateState: () => ipcRenderer.invoke('app-update:get-state') as Promise<AppUpdateState>,
-  startDownload: (url: string) => ipcRenderer.send('start-download', url),
+  checkAppUpdate: (manual = false) =>
-  onDownloadProgress: (callback: (progress: number, status: string) => void) => {
+    ipcRenderer.invoke('app-update:check', { manual }) as Promise<AppUpdateState>,
-    ipcRenderer.on('download-progress', (_event, progress, status) => callback(progress, status));
+  downloadAppUpdate: () => ipcRenderer.invoke('app-update:download') as Promise<AppUpdateState>,
+  installAppUpdate: () => ipcRenderer.invoke('app-update:quit-and-install') as Promise<boolean>,
+  openAppUpdatePage: () => ipcRenderer.invoke('app-update:open-release-page') as Promise<boolean>,
+  onAppUpdateState: (callback: (state: AppUpdateState) => void) => {
+    ipcRenderer.on('app-update:state', (_event, state: AppUpdateState) => callback(state));
   },
-  onDownloadComplete: (callback: (success: boolean, filePath: string) => void) => {
+  removeAppUpdateListeners: () => {
-    ipcRenderer.on('download-complete', (_event, success, filePath) => callback(success, filePath));
+    ipcRenderer.removeAllListeners('app-update:state');
   },
   // 语言相关
   onLanguageChanged: (callback: (locale: string) => void) => {
@@ -40,10 +46,6 @@ const api = {
       callback(locale);
     });
   },
-  removeDownloadListeners: () => {
-    ipcRenderer.removeAllListeners('download-progress');
-    ipcRenderer.removeAllListeners('download-complete');
-  },
   // 歌词缓存相关
   invoke: (channel: string, ...args: any[]) => {
     const validChannels = [

src/renderer/components/common/DisclaimerModal.vue

@@ -1,7 +1,6 @@
 <template>
   <Teleport to="body">
     <Transition name="disclaimer-modal">
-      <!-- 免责声明页面 -->
       <div
         v-if="showDisclaimer"
         class="fixed inset-0 z-[999999] flex items-center justify-center bg-black/60 backdrop-blur-md"
@@ -9,17 +8,13 @@
         <div
           class="w-full max-w-md mx-4 bg-white dark:bg-gray-900 rounded-3xl overflow-hidden shadow-2xl"
         >
-          <!-- 顶部渐变装饰 -->
           <div class="h-2 bg-gradient-to-r from-amber-400 via-orange-500 to-red-500"></div>
-          <!-- 标题 -->
           <h2 class="text-2xl font-bold text-center text-gray-900 dark:text-white px-6 mt-10">
             {{ t('comp.disclaimer.title') }}
           </h2>
 
-          <!-- 内容区域 -->
           <div class="px-6 py-6">
             <div class="space-y-4 text-sm text-gray-600 dark:text-gray-300 leading-relaxed">
-              <!-- 警告框 -->
               <div
                 class="p-4 rounded-2xl bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800"
               >
@@ -31,7 +26,6 @@
                 </div>
               </div>
 
-              <!-- 免责条款列表 -->
               <div class="space-y-3">
                 <div class="flex items-start gap-3">
                   <div
@@ -63,7 +57,6 @@
             </div>
           </div>
 
-          <!-- 操作按钮 -->
           <div class="px-6 pb-8 space-y-3">
             <button
               @click="handleAgree"
@@ -86,7 +79,6 @@
       </div>
     </Transition>
 
-    <!-- 捐赠页面 -->
     <Transition name="donate-modal">
       <div
         v-if="showDonate"
@@ -95,10 +87,8 @@
         <div
           class="w-full max-w-md mx-4 bg-white dark:bg-gray-900 rounded-3xl overflow-hidden shadow-2xl"
         >
-          <!-- 顶部渐变装饰 -->
           <div class="h-2 bg-gradient-to-r from-pink-400 via-rose-500 to-red-500"></div>
 
-          <!-- 图标区域 -->
           <div class="flex justify-center pt-8 pb-4">
             <div
               class="w-20 h-20 rounded-2xl bg-gradient-to-br from-pink-400 to-rose-500 flex items-center justify-center shadow-lg"
@@ -107,7 +97,6 @@
             </div>
           </div>
 
-          <!-- 标题 -->
           <h2 class="text-2xl font-bold text-center text-gray-900 dark:text-white px-6">
             {{ t('comp.donate.title') }}
           </h2>
@@ -116,9 +105,7 @@
             {{ t('comp.donate.subtitle') }}
           </p>
 
-          <!-- 内容区域 -->
           <div class="px-6 py-6">
-            <!-- 提示信息 -->
             <div
               class="p-4 rounded-2xl bg-rose-50 dark:bg-rose-900/20 border border-rose-200 dark:border-rose-800 mb-6"
             >
@@ -130,7 +117,6 @@
               </div>
             </div>
 
-            <!-- 捐赠方式 -->
             <div class="grid grid-cols-2 gap-4">
               <button
                 @click="openDonateLink('wechat')"
@@ -158,7 +144,6 @@
             </div>
           </div>
 
-          <!-- 进入应用按钮 -->
           <div class="px-6 pb-8">
             <button
               @click="handleEnterApp"
@@ -178,7 +163,6 @@
       </div>
     </Transition>
 
-    <!-- 收款码弹窗 -->
     <Transition name="qrcode-modal">
       <div
         v-if="showQRCode"
@@ -188,7 +172,6 @@
         <div
           class="w-full max-w-sm mx-4 bg-white dark:bg-gray-900 rounded-3xl overflow-hidden shadow-2xl"
         >
-          <!-- 顶部渐变装饰 -->
           <div
             class="h-2"
             :class="
@@ -198,7 +181,6 @@
             "
           ></div>
 
-          <!-- 标题 -->
           <div class="flex items-center justify-between px-6 py-4">
             <h3 class="text-lg font-bold text-gray-900 dark:text-white">
               {{ qrcodeType === 'wechat' ? t('comp.donate.wechatQR') : t('comp.donate.alipayQR') }}
@@ -211,7 +193,6 @@
             </button>
           </div>
 
-          <!-- 二维码图片 -->
           <div class="px-6 pb-6">
             <div class="bg-white p-4 rounded-2xl">
               <img
@@ -234,28 +215,33 @@
 import { onMounted, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 
-// 导入收款码图片
 import alipayQRCode from '@/assets/alipay.png';
 import wechatQRCode from '@/assets/wechat.png';
 import { isElectron, isLyricWindow } from '@/utils';
 
+import config from '../../../../package.json';
+
 const { t } = useI18n();
 
-// 缓存键
 const DISCLAIMER_AGREED_KEY = 'disclaimer_agreed_timestamp';
+const DONATION_SHOWN_VERSION_KEY = 'donation_shown_version';
 
 const showDisclaimer = ref(false);
 const showDonate = ref(false);
 const showQRCode = ref(false);
 const qrcodeType = ref<'wechat' | 'alipay'>('wechat');
-const isTransitioning = ref(false); // 防止用户点击过快
+const isTransitioning = ref(false);
 
-// 检查是否需要显示免责声明
 const shouldShowDisclaimer = () => {
   return !localStorage.getItem(DISCLAIMER_AGREED_KEY);
 };
 
-// 处理同意
+const shouldShowDonateAfterUpdate = () => {
+  if (!localStorage.getItem(DISCLAIMER_AGREED_KEY)) return false;
+  const shownVersion = localStorage.getItem(DONATION_SHOWN_VERSION_KEY);
+  return shownVersion !== config.version;
+};
+
 const handleAgree = () => {
   if (isTransitioning.value) return;
   isTransitioning.value = true;
@@ -267,22 +253,18 @@ const handleAgree = () => {
   }, 300);
 };
 
-// 处理不同意 - 退出应用
 const handleDisagree = () => {
   if (isTransitioning.value) return;
   isTransitioning.value = true;
 
   if (isElectron) {
-    // Electron 环境下强制退出应用
     window.api?.quitApp?.();
   } else {
-    // Web 环境下尝试关闭窗口
     window.close();
   }
   isTransitioning.value = false;
 };
 
-// 打开捐赠链接
 const openDonateLink = (type: 'wechat' | 'alipay') => {
   if (isTransitioning.value) return;
 
@@ -290,18 +272,16 @@ const openDonateLink = (type: 'wechat' | 'alipay') => {
   showQRCode.value = true;
 };
 
-// 关闭二维码弹窗
 const closeQRCode = () => {
   showQRCode.value = false;
 };
 
-// 进入应用
 const handleEnterApp = () => {
   if (isTransitioning.value) return;
   isTransitioning.value = true;
 
-  // 记录同意时间
   localStorage.setItem(DISCLAIMER_AGREED_KEY, Date.now().toString());
+  localStorage.setItem(DONATION_SHOWN_VERSION_KEY, config.version);
   showDonate.value = false;
 
   setTimeout(() => {
@@ -310,18 +290,20 @@ const handleEnterApp = () => {
 };
 
 onMounted(() => {
-  // 歌词窗口不显示免责声明
   if (isLyricWindow.value) return;
 
-  // 检查是否需要显示免责声明
   if (shouldShowDisclaimer()) {
     showDisclaimer.value = true;
+    return;
+  }
+
+  if (shouldShowDonateAfterUpdate()) {
+    showDonate.value = true;
   }
 });
 </script>
 
 <style scoped>
-/* 免责声明弹窗动画 */
 .disclaimer-modal-enter-active,
 .disclaimer-modal-leave-active {
   transition: opacity 0.3s ease;
@@ -332,7 +314,6 @@ onMounted(() => {
   opacity: 0;
 }
 
-/* 捐赠弹窗动画 */
 .donate-modal-enter-active,
 .donate-modal-leave-active {
   transition: opacity 0.3s ease;
@@ -343,7 +324,6 @@ onMounted(() => {
   opacity: 0;
 }
 
-/* 二维码弹窗动画 */
 .qrcode-modal-enter-active,
 .qrcode-modal-leave-active {
   transition: opacity 0.3s ease;

src/renderer/components/common/UpdateModal.vue

@@ -3,31 +3,31 @@
     v-model:show="showModal"
     preset="dialog"
     :show-icon="false"
-    :mask-closable="!downloading"
+    :mask-closable="!isChecking"
-    :closable="!downloading"
+    :closable="!isChecking"
     class="update-modal"
     style="width: 800px; max-width: 90vw"
   >
     <div class="p-6 pb-4">
-      <!-- 头部：图标 + 版本信息 -->
+      <div class="mb-6 flex items-center">
-      <div class="flex items-center mb-6">
         <div
-          class="w-20 h-20 mr-5 flex-shrink-0 overflow-hidden rounded-2xl shadow-lg ring-2 ring-neutral-100 dark:ring-neutral-800"
+          class="mr-5 h-20 w-20 flex-shrink-0 overflow-hidden rounded-2xl shadow-lg ring-2 ring-neutral-100 dark:ring-neutral-800"
         >
-          <img src="@/assets/logo.png" alt="App Icon" class="w-full h-full object-cover" />
+          <img src="@/assets/logo.png" alt="App Icon" class="h-full w-full object-cover" />
         </div>
-        <div class="flex-1 min-w-0">
+        <div class="min-w-0 flex-1">
-          <h2 class="text-2xl font-bold tracking-tight text-neutral-900 dark:text-white mb-1.5">
+          <h2 class="mb-1.5 text-2xl font-bold tracking-tight text-neutral-900 dark:text-white">
-            {{ t('comp.update.title') }} {{ updateInfo.latestVersion }}
+            {{ t('comp.update.title') }} {{ updateVersionText }}
           </h2>
           <div class="flex items-center gap-2">
             <span
-              class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-semibold bg-neutral-100 text-neutral-500 dark:bg-neutral-800 dark:text-neutral-400"
+              class="inline-flex items-center rounded-full bg-neutral-100 px-2.5 py-0.5 text-xs font-semibold text-neutral-500 dark:bg-neutral-800 dark:text-neutral-400"
             >
-              {{ t('comp.update.currentVersion') }} {{ updateInfo.currentVersion }}
+              {{ t('comp.update.currentVersion') }} {{ currentVersionText }}
             </span>
             <span
-              class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-semibold bg-primary/10 text-primary dark:bg-primary/20"
+              v-if="showNewBadge"
+              class="inline-flex items-center rounded-full bg-primary/10 px-2.5 py-0.5 text-xs font-semibold text-primary dark:bg-primary/20"
             >
               NEW
             </span>
@@ -35,8 +35,10 @@
         </div>
       </div>
 
-      <!-- 更新日志 -->
+      <div
-      <div class="mb-6 rounded-2xl bg-neutral-50 dark:bg-neutral-800/50 overflow-hidden">
+        v-if="hasReleaseNotes"
+        class="mb-6 overflow-hidden rounded-2xl bg-neutral-50 dark:bg-neutral-800/50"
+      >
         <n-scrollbar style="max-height: 300px">
           <div
             class="update-body p-5 text-sm leading-relaxed text-neutral-600 dark:text-neutral-300"
@@ -45,61 +47,54 @@
         </n-scrollbar>
       </div>
 
-      <!-- 下载进度 -->
+      <div
-      <div v-if="downloading" class="mb-6 rounded-2xl bg-neutral-50 dark:bg-neutral-800/50 p-4">
+        v-if="showProgressCard"
-        <div class="flex items-center justify-between mb-2.5">
+        class="mb-6 rounded-2xl bg-neutral-50 p-4 dark:bg-neutral-800/50"
-          <span class="text-sm text-neutral-500 dark:text-neutral-400">{{ downloadStatus }}</span>
+      >
-          <span class="text-sm font-bold text-primary">{{ downloadProgress }}%</span>
+        <div class="mb-2.5 flex items-center justify-between">
+          <span class="text-sm text-neutral-500 dark:text-neutral-400">{{ progressText }}</span>
+          <span class="text-sm font-bold text-primary">{{ progressPercent }}%</span>
         </div>
         <div
           class="relative h-2 w-full overflow-hidden rounded-full bg-neutral-200 dark:bg-neutral-700"
         >
           <div
             class="absolute inset-y-0 left-0 rounded-full bg-primary transition-all duration-300 ease-out shadow-[0_0_10px_rgba(34,197,94,0.4)]"
-            :style="{ width: `${downloadProgress}%` }"
+            :style="{ width: `${progressPercent}%` }"
           />
         </div>
       </div>
 
-      <!-- 操作按钮 -->
+      <div
-      <div class="flex gap-3" :class="{ 'mt-6': !downloading }">
+        v-if="showErrorCard"
+        class="mb-6 rounded-2xl border border-amber-200 bg-amber-50 p-4 text-sm text-amber-700 dark:border-amber-900/60 dark:bg-amber-950/30 dark:text-amber-200"
+      >
+        <div class="mb-1 font-semibold">{{ t('comp.update.autoUpdateFailed') }}</div>
+        <div>{{ errorText }}</div>
+      </div>
+
+      <div class="flex gap-3" :class="{ 'mt-6': !showProgressCard }">
         <button
-          class="flex-1 rounded-xl py-2.5 text-sm font-semibold transition-all duration-200 bg-neutral-100 text-neutral-600 hover:bg-neutral-200 dark:bg-neutral-800 dark:text-neutral-300 dark:hover:bg-neutral-700 disabled:opacity-50 disabled:cursor-not-allowed"
+          class="flex-1 rounded-xl bg-neutral-100 py-2.5 text-sm font-semibold text-neutral-600 transition-all duration-200 hover:bg-neutral-200 disabled:cursor-not-allowed disabled:opacity-50 dark:bg-neutral-800 dark:text-neutral-300 dark:hover:bg-neutral-700"
-          :disabled="downloading"
+          :disabled="isChecking"
           @click="closeModal"
         >
           {{ t('comp.update.cancel') }}
         </button>
         <button
-          v-if="!downloading"
+          class="flex-1 rounded-xl bg-primary py-2.5 text-sm font-semibold text-white transition-all duration-200 hover:scale-[1.02] hover:bg-primary/90 active:scale-95 disabled:cursor-not-allowed disabled:opacity-50"
-          class="flex-1 rounded-xl py-2.5 text-sm font-semibold transition-all duration-200 bg-primary text-white hover:bg-primary/90 shadow-lg shadow-primary/25 hover:scale-[1.02] active:scale-95 disabled:opacity-50 disabled:cursor-not-allowed"
+          :disabled="primaryButtonDisabled"
-          :disabled="downloading"
+          @click="handlePrimaryAction"
-          @click="handleUpdate"
         >
-          {{ downloadBtnText }}
+          {{ primaryButtonText }}
-        </button>
-        <button
-          v-else
-          class="flex-1 rounded-xl py-2.5 text-sm font-semibold transition-all duration-200 bg-primary text-white hover:bg-primary/90 shadow-lg shadow-primary/25 hover:scale-[1.02] active:scale-95"
-          @click="closeModal"
-        >
-          {{ t('comp.update.backgroundDownload') }}
         </button>
       </div>
 
-      <!-- 底部提示 -->
       <p
-        v-if="!downloading"
+        v-if="showManualHint"
         class="mt-4 text-center text-xs text-neutral-400 dark:text-neutral-500"
       >
-        {{ t('comp.installApp.downloadProblem') }}
+        {{ t('comp.update.manualFallbackHint') }}
-        <a
-          class="text-primary hover:text-primary/80 transition-colors"
-          target="_blank"
-          href="https://github.com/algerkong/AlgerMusicPlayer/releases"
-          >GitHub</a
-        >
-        {{ t('comp.installApp.downloadProblemLinkText') }}
       </p>
     </div>
   </n-modal>
@@ -107,301 +102,235 @@
 
 <script setup lang="ts">
 import { marked } from 'marked';
-import { computed, h, onMounted, onUnmounted, ref } from 'vue';
+import { computed, onMounted, onUnmounted } from 'vue';
 import { useI18n } from 'vue-i18n';
 
 import { useSettingsStore } from '@/store/modules/settings';
-import { checkUpdate, getProxyNodes, UpdateResult } from '@/utils/update';
 
-import config from '../../../../package.json';
+import {
+  APP_UPDATE_STATUS,
+  type AppUpdateState,
+  createDefaultAppUpdateState
+} from '../../../shared/appUpdate';
 
-const { t } = useI18n();
-const dialog = useDialog();
-const message = useMessage();
-
-// 配置 marked（只需执行一次）
 marked.setOptions({ breaks: true, gfm: true });
 
-const GITHUB_RELEASE_BASE = 'https://github.com/algerkong/AlgerMusicPlayer/releases/download';
+const { t } = useI18n();
-const GITHUB_RELEASES_URL = 'https://github.com/algerkong/AlgerMusicPlayer/releases';
+const message = useMessage();
-
 const settingsStore = useSettingsStore();
-const ipc = window.electron.ipcRenderer;
 
 const showModal = computed({
   get: () => settingsStore.showUpdateModal,
-  set: (val) => settingsStore.setShowUpdateModal(val)
+  set: (value) => settingsStore.setShowUpdateModal(value)
 });
 
-const updateInfo = ref<UpdateResult>({
+const updateState = computed(() => settingsStore.appUpdateState);
-  hasUpdate: false,
+const isChecking = computed(() => updateState.value.status === APP_UPDATE_STATUS.checking);
-  latestVersion: '',
+const isDownloading = computed(() => updateState.value.status === APP_UPDATE_STATUS.downloading);
-  currentVersion: config.version,
+const isDownloaded = computed(() => updateState.value.status === APP_UPDATE_STATUS.downloaded);
-  releaseInfo: null
+const showErrorCard = computed(() => updateState.value.status === APP_UPDATE_STATUS.error);
-});
+const showManualHint = computed(() => showErrorCard.value);
+const showProgressCard = computed(() => isDownloading.value || isDownloaded.value);
+const showNewBadge = computed(
+  () =>
+    updateState.value.status === APP_UPDATE_STATUS.available ||
+    updateState.value.status === APP_UPDATE_STATUS.downloading ||
+    updateState.value.status === APP_UPDATE_STATUS.downloaded
+);
+const hasReleaseNotes = computed(() => Boolean(updateState.value.releaseNotes));
 
-const downloading = ref(false);
+const currentVersionText = computed(() => updateState.value.currentVersion || '--');
-const downloadProgress = ref(0);
+const updateVersionText = computed(() => updateState.value.availableVersion || '--');
-const downloadStatus = ref(t('comp.update.prepareDownload'));
+const progressPercent = computed(() => Math.round(updateState.value.downloadProgress));
-const isDialogShown = ref(false);
+const errorText = computed(() => updateState.value.errorMessage || t('comp.update.downloadFailed'));
 
 const parsedReleaseNotes = computed(() => {
-  const body = updateInfo.value.releaseInfo?.body;
+  const releaseNotes = updateState.value.releaseNotes;
-  if (!body) return '';
+  if (!releaseNotes) return '';
+
   try {
-    return marked.parse(body);
+    return marked.parse(releaseNotes) as string;
   } catch (error) {
     console.error('Markdown 解析失败:', error);
-    return body;
+    return releaseNotes;
   }
 });
 
-const downloadBtnText = computed(() =>
+const progressText = computed(() => {
-  downloading.value ? t('comp.update.downloading') : t('comp.update.nowUpdate')
+  if (isDownloaded.value) {
-);
+    return t('comp.update.readyToInstall');
+  }
+
+  if (!isDownloading.value) {
+    return t('comp.update.prepareDownload');
+  }
+
+  const downloaded = formatBytes(updateState.value.downloadedBytes);
+  const total = formatBytes(updateState.value.totalBytes);
+  return `${t('comp.update.downloading')} ${downloaded} / ${total}`;
+});
+
+const primaryButtonText = computed(() => {
+  switch (updateState.value.status) {
+    case APP_UPDATE_STATUS.checking:
+      return t('comp.update.checking');
+    case APP_UPDATE_STATUS.available:
+      return t('comp.update.nowUpdate');
+    case APP_UPDATE_STATUS.downloading:
+      return t('comp.update.backgroundDownload');
+    case APP_UPDATE_STATUS.downloaded:
+      return t('comp.update.yesInstall');
+    case APP_UPDATE_STATUS.error:
+      return t('comp.update.openOfficialSite');
+    default:
+      return t('comp.update.nowUpdate');
+  }
+});
+
+const primaryButtonDisabled = computed(() => isChecking.value);
+
+const formatBytes = (bytes: number): string => {
+  if (!bytes) {
+    return '0 B';
+  }
+
+  const units = ['B', 'KB', 'MB', 'GB'];
+  const base = Math.min(Math.floor(Math.log(bytes) / Math.log(1024)), units.length - 1);
+  const value = bytes / 1024 ** base;
+  return `${value.toFixed(base === 0 ? 0 : 2)} ${units[base]}`;
+};
+
+const syncUpdateState = (state: AppUpdateState) => {
+  const previousStatus = settingsStore.appUpdateState.status;
+  settingsStore.setAppUpdateState(state);
+
+  if (
+    state.status === APP_UPDATE_STATUS.available ||
+    state.status === APP_UPDATE_STATUS.downloaded
+  ) {
+    settingsStore.setShowUpdateModal(true);
+    return;
+  }
+
+  if (
+    state.status === APP_UPDATE_STATUS.error &&
+    (previousStatus === APP_UPDATE_STATUS.available ||
+      previousStatus === APP_UPDATE_STATUS.downloading)
+  ) {
+    settingsStore.setShowUpdateModal(true);
+  }
+};
 
 const closeModal = () => {
   showModal.value = false;
 };
 
-// ---- 下载 URL 解析 ----
+const handlePrimaryAction = async () => {
-
-const buildReleaseUrl = (version: string, suffix: string): string =>
-  `${GITHUB_RELEASE_BASE}/v${version}/AlgerMusicPlayer-${version}${suffix}`;
-
-const resolveDownloadUrl = (
-  assets: any[],
-  platform: string,
-  arch: string,
-  version: string
-): string => {
-  // 从 release assets 中按平台/架构匹配
-  const findAsset = (keywords: string[]): string | undefined =>
-    assets.find((a) => keywords.every((k) => a.name.includes(k)))?.browser_download_url;
-
-  if (platform === 'darwin') {
-    const macArch = arch === 'arm64' ? 'arm64' : 'x64';
-    return findAsset(['mac', macArch]) || buildReleaseUrl(version, `-${macArch}.dmg`);
-  }
-
-  if (platform === 'win32') {
-    const winArch = arch === 'x64' ? 'x64' : 'ia32';
-    return (
-      findAsset(['win', winArch]) ||
-      buildReleaseUrl(version, `-win-${winArch}.exe`) ||
-      buildReleaseUrl(version, '-win.exe')
-    );
-  }
-
-  if (platform === 'linux') {
-    return (
-      findAsset(['x64', '.AppImage']) ||
-      findAsset(['x64', '.deb']) ||
-      buildReleaseUrl(version, '-linux-x64.AppImage')
-    );
-  }
-
-  return '';
-};
-
-// ---- IPC 事件处理 ----
-
-const onDownloadProgress = (_event: any, progress: number, status: string) => {
-  downloadProgress.value = progress;
-  downloadStatus.value = status;
-};
-
-const showInstallDialog = (filePath: string) => {
-  const copyFilePath = () => {
-    navigator.clipboard
-      .writeText(filePath)
-      .then(() => message.success(t('comp.update.copySuccess')))
-      .catch(() => message.error(t('comp.update.copyFailed')));
-  };
-
-  const dialogRef = dialog.create({
-    title: t('comp.update.installConfirmTitle'),
-    content: () =>
-      h('div', { class: 'flex flex-col gap-3' }, [
-        h(
-          'p',
-          { class: 'text-base font-medium text-neutral-800 dark:text-neutral-100' },
-          t('comp.update.installConfirmContent')
-        ),
-        h('div', { class: 'h-px bg-neutral-200 dark:bg-neutral-700' }),
-        h(
-          'p',
-          { class: 'text-sm text-neutral-500 dark:text-neutral-400' },
-          t('comp.update.manualInstallTip')
-        ),
-        h('div', { class: 'flex items-center gap-3 mt-1' }, [
-          h('div', { class: 'flex-1 min-w-0' }, [
-            h(
-              'p',
-              { class: 'text-xs text-neutral-400 dark:text-neutral-500 mb-1' },
-              t('comp.update.fileLocation')
-            ),
-            h(
-              'div',
-              {
-                class:
-                  'rounded-xl bg-neutral-100 dark:bg-neutral-800 px-3 py-2 text-xs font-mono text-neutral-700 dark:text-neutral-300 break-all'
-              },
-              filePath
-            )
-          ]),
-          h(
-            'button',
-            {
-              class:
-                'flex items-center gap-1.5 rounded-xl bg-neutral-200 dark:bg-neutral-700 px-3 py-2 text-xs text-neutral-600 dark:text-neutral-300 cursor-pointer transition-colors hover:bg-neutral-300 dark:hover:bg-neutral-600 flex-shrink-0',
-              onClick: copyFilePath
-            },
-            [h('i', { class: 'ri-file-copy-line text-sm' }), h('span', t('comp.update.copy'))]
-          )
-        ])
-      ]),
-    positiveText: t('comp.update.yesInstall'),
-    negativeText: t('comp.update.noThanks'),
-    onPositiveClick: () => {
-      ipc.send('install-update', filePath);
-    },
-    onNegativeClick: () => {
-      dialogRef.destroy();
-    },
-    onClose: () => {
-      isDialogShown.value = false;
-    }
-  });
-};
-
-const onDownloadComplete = (_event: any, success: boolean, filePath: string) => {
-  downloading.value = false;
-  closeModal();
-
-  if (success && !isDialogShown.value) {
-    isDialogShown.value = true;
-    showInstallDialog(filePath);
-  } else if (!success) {
-    message.error(t('comp.update.downloadFailed'));
-  }
-};
-
-// ---- 生命周期 ----
-
-const registerIpcListeners = () => {
-  // 先移除旧监听，防止重复注册
-  ipc.removeListener('download-progress', onDownloadProgress);
-  ipc.removeListener('download-complete', onDownloadComplete);
-  ipc.on('download-progress', onDownloadProgress);
-  ipc.on('download-complete', onDownloadComplete);
-};
-
-const removeIpcListeners = () => {
-  ipc.removeListener('download-progress', onDownloadProgress);
-  ipc.removeListener('download-complete', onDownloadComplete);
-};
-
-onMounted(async () => {
-  registerIpcListeners();
   try {
-    const result = await checkUpdate(config.version);
+    switch (updateState.value.status) {
-    if (result) {
+      case APP_UPDATE_STATUS.available:
-      updateInfo.value = result;
+        await window.api.downloadAppUpdate();
-      showModal.value = true;
+        break;
+      case APP_UPDATE_STATUS.downloading:
+        closeModal();
+        break;
+      case APP_UPDATE_STATUS.downloaded:
+        await window.api.installAppUpdate();
+        break;
+      case APP_UPDATE_STATUS.error:
+        await window.api.openAppUpdatePage();
+        break;
+      default:
+        break;
     }
   } catch (error) {
-    console.error('检查更新失败:', error);
+    console.error('执行更新操作失败:', error);
+    message.error(t('comp.update.autoUpdateFailed'));
   }
+};
+
+const initializeUpdateState = async () => {
+  try {
+    const currentState = await window.api.getAppUpdateState();
+    syncUpdateState(currentState);
+
+    if (currentState.supported && currentState.status === APP_UPDATE_STATUS.idle) {
+      await window.api.checkAppUpdate(false);
+    }
+  } catch (error) {
+    console.error('初始化更新状态失败:', error);
+    settingsStore.setAppUpdateState(createDefaultAppUpdateState());
+  }
+};
+
+onMounted(() => {
+  window.api.removeAppUpdateListeners();
+  window.api.onAppUpdateState(syncUpdateState);
+  void initializeUpdateState();
 });
 
 onUnmounted(() => {
-  removeIpcListeners();
+  window.api.removeAppUpdateListeners();
-  isDialogShown.value = false;
 });
-
-// ---- 触发更新下载 ----
-
-const handleUpdate = async () => {
-  const { releaseInfo, latestVersion } = updateInfo.value;
-  const assets = releaseInfo?.assets ?? [];
-  const { platform } = window.electron.process;
-  const arch = ipc.sendSync('get-arch');
-
-  const downloadUrl = resolveDownloadUrl(assets, platform, arch, latestVersion);
-
-  if (!downloadUrl) {
-    message.error(t('comp.update.noDownloadUrl'));
-    window.open(`${GITHUB_RELEASES_URL}/latest`, '_blank');
-    return;
-  }
-
-  try {
-    downloading.value = true;
-    downloadProgress.value = 0;
-    downloadStatus.value = t('comp.update.prepareDownload');
-    isDialogShown.value = false;
-
-    const proxyHosts = await getProxyNodes();
-    ipc.send('start-download', `${proxyHosts[0]}/${downloadUrl}`);
-  } catch (error) {
-    downloading.value = false;
-    message.error(t('comp.update.startFailed'));
-    console.error('下载失败:', error);
-  }
-};
 </script>
 
 <style scoped>
-/* 弹窗圆角 */
 .update-modal :deep(.n-dialog) {
-  border-radius: 1.25rem; /* 20px — rounded-2xl 级别 */
+  border-radius: 1.25rem;
   overflow: hidden;
 }
 
-/* 更新日志 Markdown 渲染样式 */
 .update-body :deep(h1) {
   font-size: 1.25rem;
   font-weight: 700;
   margin-bottom: 0.75rem;
 }
+
 .update-body :deep(h2) {
   font-size: 1.125rem;
   font-weight: 700;
   margin-bottom: 0.75rem;
 }
+
 .update-body :deep(h3) {
   font-size: 1rem;
   font-weight: 700;
   margin-bottom: 0.5rem;
 }
+
 .update-body :deep(p) {
   margin-bottom: 0.75rem;
   line-height: 1.625;
 }
+
 .update-body :deep(ul) {
   list-style-type: disc;
   list-style-position: inside;
   margin-bottom: 0.75rem;
 }
+
 .update-body :deep(ol) {
   list-style-type: decimal;
   list-style-position: inside;
   margin-bottom: 0.75rem;
 }
+
 .update-body :deep(li) {
   margin-bottom: 0.5rem;
   line-height: 1.625;
 }
+
 .update-body :deep(code) {
   padding: 0.125rem 0.375rem;
   border-radius: 0.375rem;
   font-size: 0.8125rem;
   background-color: rgb(245 245 245);
 }
+
 .dark .update-body :deep(code) {
   background-color: rgb(64 64 64);
 }
+
 .update-body :deep(pre) {
   padding: 0.75rem;
   border-radius: 0.75rem;
@@ -409,51 +338,69 @@ const handleUpdate = async () => {
   margin-bottom: 0.75rem;
   background-color: rgb(245 245 245);
 }
+
 .dark .update-body :deep(pre) {
   background-color: rgb(64 64 64);
 }
+
 .update-body :deep(pre code) {
   background-color: transparent;
   padding: 0;
 }
+
 .update-body :deep(blockquote) {
   padding-left: 1rem;
-  border-left: 4px solid rgb(229 229 229);
+  border-left: 0.25rem solid rgb(229 229 229);
   margin-bottom: 0.75rem;
+  color: rgb(115 115 115);
 }
+
 .dark .update-body :deep(blockquote) {
   border-left-color: rgb(82 82 82);
+  color: rgb(163 163 163);
 }
+
 .update-body :deep(a) {
-  color: #22c55e;
+  color: rgb(var(--primary-color));
-  transition: color 0.2s;
+  text-decoration: underline;
 }
+
 .update-body :deep(a:hover) {
-  color: rgb(34 197 94 / 0.8);
+  opacity: 0.85;
 }
+
 .update-body :deep(hr) {
   margin: 1rem 0;
-  border-color: rgb(229 229 229);
+  border: 0;
+  border-top: 1px solid rgb(229 229 229);
 }
+
 .dark .update-body :deep(hr) {
-  border-color: rgb(82 82 82);
+  border-top-color: rgb(82 82 82);
 }
+
 .update-body :deep(table) {
   width: 100%;
+  border-collapse: collapse;
   margin-bottom: 0.75rem;
 }
+
 .update-body :deep(th),
 .update-body :deep(td) {
-  padding: 0.5rem 0.75rem;
   border: 1px solid rgb(229 229 229);
+  padding: 0.5rem 0.75rem;
+  text-align: left;
 }
+
 .dark .update-body :deep(th),
 .dark .update-body :deep(td) {
   border-color: rgb(82 82 82);
 }
+
 .update-body :deep(th) {
   background-color: rgb(245 245 245);
 }
+
 .dark .update-body :deep(th) {
   background-color: rgb(64 64 64);
 }

src/renderer/store/modules/settings.ts

@@ -14,11 +14,14 @@ import {
   watchSystemTheme
 } from '@/utils/theme';
 
+import { type AppUpdateState,createDefaultAppUpdateState } from '../../../shared/appUpdate';
+
 export const useSettingsStore = defineStore('settings', () => {
   const theme = ref<ThemeType>(getCurrentTheme());
   const isMobile = ref(false);
   const isMiniMode = ref(false);
   const showUpdateModal = ref(false);
+  const appUpdateState = ref<AppUpdateState>(createDefaultAppUpdateState());
   const showArtistDrawer = ref(false);
   const currentArtistId = ref<number | null>(null);
   const systemFonts = ref<{ label: string; value: string }[]>([
@@ -147,6 +150,10 @@ export const useSettingsStore = defineStore('settings', () => {
     showUpdateModal.value = value;
   };
 
+  const setAppUpdateState = (value: AppUpdateState) => {
+    appUpdateState.value = value;
+  };
+
   const setShowArtistDrawer = (show: boolean) => {
     showArtistDrawer.value = show;
     if (!show) {
@@ -263,6 +270,7 @@ export const useSettingsStore = defineStore('settings', () => {
     isMobile,
     isMiniMode,
     showUpdateModal,
+    appUpdateState,
     showArtistDrawer,
     currentArtistId,
     systemFonts,
@@ -272,6 +280,7 @@ export const useSettingsStore = defineStore('settings', () => {
     setAutoTheme,
     setMiniMode,
     setShowUpdateModal,
+    setAppUpdateState,
     setShowArtistDrawer,
     setCurrentArtistId,
     setSystemFonts,

src/renderer/views/set/index.vue

@@ -614,10 +614,15 @@
             <!-- 版本信息 -->
             <setting-item :title="t('settings.about.version')">
               <template #description>
-                {{ updateInfo.currentVersion }}
+                <div class="flex flex-wrap items-center gap-2">
-                <n-tag v-if="updateInfo.hasUpdate" type="success" class="ml-2">
+                  <span>{{ updateInfo.currentVersion }}</span>
-                  {{ t('settings.about.hasUpdate') }} {{ updateInfo.latestVersion }}
+                  <n-tag v-if="updateInfo.hasUpdate" type="success">
-                </n-tag>
+                    {{ t('settings.about.hasUpdate') }} {{ updateInfo.latestVersion }}
+                  </n-tag>
+                </div>
+                <div v-if="hasManualUpdateFallback" class="mt-2 text-xs text-amber-600">
+                  {{ appUpdateState.errorMessage || t('settings.about.messages.checkError') }}
+                </div>
               </template>
               <template #action>
                 <div class="flex items-center gap-2 flex-wrap">
@@ -627,6 +632,14 @@
                   <n-button v-if="updateInfo.hasUpdate" size="small" @click="openReleasePage">
                     {{ t('settings.about.gotoUpdate') }}
                   </n-button>
+                  <n-button
+                    v-if="hasManualUpdateFallback"
+                    size="small"
+                    tertiary
+                    @click="openManualUpdatePage"
+                  >
+                    {{ t('settings.about.manualUpdate') }}
+                  </n-button>
                 </div>
               </template>
             </setting-item>
@@ -705,6 +718,11 @@ import { openDirectory, selectDirectory } from '@/utils/fileOperation';
 import { checkUpdate, UpdateResult } from '@/utils/update';
 
 import config from '../../../../package.json';
+import {
+  APP_UPDATE_STATUS,
+  createDefaultAppUpdateState,
+  hasAvailableAppUpdate
+} from '../../../shared/appUpdate';
 import SettingItem from './SettingItem.vue';
 import SettingSection from './SettingSection.vue';
 
@@ -853,19 +871,62 @@ const handleGpuAccelerationChange = (enabled: boolean) => {
 
 // ==================== 更新检查 ====================
 const checking = ref(false);
-const updateInfo = ref<UpdateResult>({
+const webUpdateInfo = ref<UpdateResult>({
   hasUpdate: false,
   latestVersion: '',
   currentVersion: config.version,
   releaseInfo: null
 });
 
+const appUpdateState = computed(() => settingsStore.appUpdateState);
+const hasAppUpdate = computed(() => hasAvailableAppUpdate(appUpdateState.value));
+const hasManualUpdateFallback = computed(
+  () => isElectron && appUpdateState.value.status === APP_UPDATE_STATUS.error
+);
+
+const updateInfo = computed<UpdateResult>(() => {
+  if (!isElectron) {
+    return webUpdateInfo.value;
+  }
+
+  return {
+    hasUpdate: hasAppUpdate.value,
+    latestVersion: appUpdateState.value.availableVersion ?? '',
+    currentVersion: appUpdateState.value.currentVersion || config.version,
+    releaseInfo: appUpdateState.value.availableVersion
+      ? {
+          tag_name: appUpdateState.value.availableVersion,
+          body: appUpdateState.value.releaseNotes,
+          html_url: appUpdateState.value.releasePageUrl,
+          assets: []
+        }
+      : null
+  };
+});
+
 const checkForUpdates = async (isClick = false) => {
   checking.value = true;
   try {
+    if (isElectron) {
+      const result = await window.api.checkAppUpdate(isClick);
+      settingsStore.setAppUpdateState(result);
+
+      if (hasAvailableAppUpdate(result)) {
+        if (isClick) {
+          settingsStore.setShowUpdateModal(true);
+        }
+      } else if (result.status === APP_UPDATE_STATUS.notAvailable && isClick) {
+        message.success(t('settings.about.latest'));
+      } else if (result.status === APP_UPDATE_STATUS.error && isClick) {
+        message.error(result.errorMessage || t('settings.about.messages.checkError'));
+      }
+
+      return;
+    }
+
     const result = await checkUpdate(config.version);
     if (result) {
-      updateInfo.value = result;
+      webUpdateInfo.value = result;
       if (!result.hasUpdate && isClick) {
         message.success(t('settings.about.latest'));
       }
@@ -883,7 +944,21 @@ const checkForUpdates = async (isClick = false) => {
 };
 
 const openReleasePage = () => {
-  settingsStore.showUpdateModal = true;
+  if (isElectron) {
+    settingsStore.setShowUpdateModal(true);
+    return;
+  }
+
+  window.open(updateInfo.value.releaseInfo?.html_url || setData.value.authorUrl);
+};
+
+const openManualUpdatePage = async () => {
+  if (isElectron) {
+    await window.api.openAppUpdatePage();
+    return;
+  }
+
+  window.open(updateInfo.value.releaseInfo?.html_url || setData.value.authorUrl);
 };
 
 const openAuthor = () => {
@@ -1399,7 +1474,9 @@ const currentSection = ref('basic');
 
 // ==================== 初始化 ====================
 onMounted(async () => {
-  checkForUpdates();
+  if (isElectron && settingsStore.appUpdateState.currentVersion === '') {
+    settingsStore.setAppUpdateState(createDefaultAppUpdateState(config.version));
+  }
   if (setData.value.proxyConfig) {
     proxyForm.value = { ...setData.value.proxyConfig };
   }

src/shared/appUpdate.ts

@@ -0,0 +1,56 @@
+export const APP_UPDATE_STATUS = {
+  idle: 'idle',
+  checking: 'checking',
+  available: 'available',
+  notAvailable: 'not-available',
+  downloading: 'downloading',
+  downloaded: 'downloaded',
+  error: 'error'
+} as const;
+
+export const APP_UPDATE_RELEASE_URL =
+  'https://github.com/algerkong/AlgerMusicPlayer/releases/latest';
+
+export type AppUpdateStatus = (typeof APP_UPDATE_STATUS)[keyof typeof APP_UPDATE_STATUS];
+
+export type AppUpdateState = {
+  supported: boolean;
+  status: AppUpdateStatus;
+  currentVersion: string;
+  availableVersion: string | null;
+  releaseNotes: string;
+  releaseDate: string | null;
+  releasePageUrl: string;
+  downloadProgress: number;
+  downloadedBytes: number;
+  totalBytes: number;
+  bytesPerSecond: number;
+  errorMessage: string | null;
+  checkedAt: number | null;
+};
+
+export function createDefaultAppUpdateState(currentVersion = ''): AppUpdateState {
+  return {
+    supported: false,
+    status: APP_UPDATE_STATUS.idle,
+    currentVersion,
+    availableVersion: null,
+    releaseNotes: '',
+    releaseDate: null,
+    releasePageUrl: APP_UPDATE_RELEASE_URL,
+    downloadProgress: 0,
+    downloadedBytes: 0,
+    totalBytes: 0,
+    bytesPerSecond: 0,
+    errorMessage: null,
+    checkedAt: null
+  };
+}
+
+export function hasAvailableAppUpdate(state: AppUpdateState): boolean {
+  return (
+    state.status === APP_UPDATE_STATUS.available ||
+    state.status === APP_UPDATE_STATUS.downloading ||
+    state.status === APP_UPDATE_STATUS.downloaded
+  );
+}