Merge pull request #1964 from bubblepipe/electron

feat: Add Electron wrapper for desktop app

.github/workflows/electron-build.yml

+name: Build Electron App
+
+on:
+  push:
+    tags:
+      - '*'  # Triggers on version tags like v1.0.0
+  workflow_dispatch:  # Allows manual triggering
+
+jobs:
+  build:
+    strategy:
+      matrix:
+        # os: [macos-latest, windows-latest]
+        os: [windows-latest]
+
+    runs-on: ${{ matrix.os }}
+    defaults:
+      run:
+        shell: bash
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      - name: Setup Bun
+        uses: oven-sh/setup-bun@v2
+        with:
+          bun-version: latest
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '20'
+
+      - name: Setup Go
+        uses: actions/setup-go@v5
+        with:
+          go-version: '>=1.18.0'
+
+      - name: Build frontend
+        env:
+          CI: ""
+          NODE_OPTIONS: "--max-old-space-size=4096"
+        run: |
+          cd web
+          bun install
+          DISABLE_ESLINT_PLUGIN='true' VITE_REACT_APP_VERSION=$(git describe --tags) bun run build
+          cd ..
+
+      # - name: Build Go binary (macos/Linux)
+      #   if: runner.os != 'Windows'
+      #   run: |
+      #     go mod download
+      #     go build -ldflags "-s -w -X 'one-api/common.Version=$(git describe --tags)' -extldflags '-static'" -o new-api
+
+      - name: Build Go binary (Windows)
+        if: runner.os == 'Windows'
+        run: |
+          go mod download
+          go build -ldflags "-s -w -X 'one-api/common.Version=$(git describe --tags)'" -o new-api.exe
+
+      - name: Update Electron version
+        run: |
+          cd electron
+          VERSION=$(git describe --tags)
+          VERSION=${VERSION#v}  # Remove 'v' prefix if present
+          npm version $VERSION --no-git-tag-version --allow-same-version
+
+      - name: Install Electron dependencies
+        run: |
+          cd electron
+          npm install
+
+      # - name: Build Electron app (macOS)
+      #   if: runner.os == 'macOS'
+      #   run: |
+      #     cd electron
+      #     npm run build:mac
+      #   env:
+      #     CSC_IDENTITY_AUTO_DISCOVERY: false  # Skip code signing
+
+      - name: Build Electron app (Windows)
+        if: runner.os == 'Windows'
+        run: |
+          cd electron
+          npm run build:win
+
+      # - name: Upload artifacts (macOS)
+      #   if: runner.os == 'macOS'
+      #   uses: actions/upload-artifact@v4
+      #   with:
+      #     name: macos-build
+      #     path: |
+      #       electron/dist/*.dmg
+      #       electron/dist/*.zip
+
+      - name: Upload artifacts (Windows)
+        if: runner.os == 'Windows'
+        uses: actions/upload-artifact@v4
+        with:
+          name: windows-build
+          path: |
+            electron/dist/*.exe
+
+  release:
+    needs: build
+    runs-on: ubuntu-latest
+    if: startsWith(github.ref, 'refs/tags/')
+
+    steps:
+      - name: Download all artifacts
+        uses: actions/download-artifact@v4
+
+      - name: Create Release
+        uses: softprops/action-gh-release@v2
+        with:
+          files: |
+            # macos-build/*
+            windows-build/*
+          draft: false
+          prerelease: false
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
\ No newline at end of file

.github/workflows/linux-release.yml

@@ -38,21 +38,22 @@ jobs:
       - name: Build Backend (amd64)
       - name: Build Backend (amd64)
         run: |
         run: |
           go mod download
           go mod download
-          go build -ldflags "-s -w -X 'one-api/common.Version=$(git describe --tags)' -extldflags '-static'" -o new-api
+          VERSION=$(git describe --tags)
+          go build -ldflags "-s -w -X 'one-api/common.Version=$VERSION' -extldflags '-static'" -o new-api-$VERSION
 
 
       - name: Build Backend (arm64)
       - name: Build Backend (arm64)
         run: |
         run: |
           sudo apt-get update
           sudo apt-get update
           DEBIAN_FRONTEND=noninteractive sudo apt-get install -y gcc-aarch64-linux-gnu
           DEBIAN_FRONTEND=noninteractive sudo apt-get install -y gcc-aarch64-linux-gnu
-          CC=aarch64-linux-gnu-gcc CGO_ENABLED=1 GOOS=linux GOARCH=arm64 go build -ldflags "-s -w -X 'one-api/common.Version=$(git describe --tags)' -extldflags '-static'" -o new-api-arm64
+          VERSION=$(git describe --tags)
+          CC=aarch64-linux-gnu-gcc CGO_ENABLED=1 GOOS=linux GOARCH=arm64 go build -ldflags "-s -w -X 'one-api/common.Version=$VERSION' -extldflags '-static'" -o new-api-arm64-$VERSION
 
 
       - name: Release
       - name: Release
-        uses: softprops/action-gh-release@v1
+        uses: softprops/action-gh-release@v2
         if: startsWith(github.ref, 'refs/tags/')
         if: startsWith(github.ref, 'refs/tags/')
         with:
         with:
           files: |
           files: |
-            new-api
-            new-api-arm64
+            new-api-*
           draft: true
           draft: true
           generate_release_notes: true
           generate_release_notes: true
         env:
         env:

.github/workflows/macos-release.yml

@@ -39,12 +39,13 @@ jobs:
       - name: Build Backend
       - name: Build Backend
         run: |
         run: |
           go mod download
           go mod download
-          go build -ldflags "-X 'one-api/common.Version=$(git describe --tags)'" -o new-api-macos
+          VERSION=$(git describe --tags)
+          go build -ldflags "-X 'one-api/common.Version=$VERSION'" -o new-api-macos-$VERSION
       - name: Release
       - name: Release
-        uses: softprops/action-gh-release@v1
+        uses: softprops/action-gh-release@v2
         if: startsWith(github.ref, 'refs/tags/')
         if: startsWith(github.ref, 'refs/tags/')
         with:
         with:
-          files: new-api-macos
+          files: new-api-macos-*
           draft: true
           draft: true
           generate_release_notes: true
           generate_release_notes: true
         env:
         env:

.github/workflows/windows-release.yml

@@ -41,12 +41,13 @@ jobs:
       - name: Build Backend
       - name: Build Backend
         run: |
         run: |
           go mod download
           go mod download
-          go build -ldflags "-s -w -X 'one-api/common.Version=$(git describe --tags)'" -o new-api.exe
+          VERSION=$(git describe --tags)
+          go build -ldflags "-s -w -X 'one-api/common.Version=$VERSION'" -o new-api-$VERSION.exe
       - name: Release
       - name: Release
-        uses: softprops/action-gh-release@v1
+        uses: softprops/action-gh-release@v2
         if: startsWith(github.ref, 'refs/tags/')
         if: startsWith(github.ref, 'refs/tags/')
         with:
         with:
-          files: new-api.exe
+          files: new-api-*.exe
           draft: true
           draft: true
           generate_release_notes: true
           generate_release_notes: true
         env:
         env:

.gitignore

@@ -9,6 +9,10 @@ logs
 web/dist
 web/dist
 .env
 .env
 one-api
 one-api
+new-api
 .DS_Store
 .DS_Store
 tiktoken_cache
 tiktoken_cache
-.eslintcache
+.eslintcache
\ No newline at end of file
+
+electron/node_modules
+electron/dist
\ No newline at end of file

electron/README.md

+# New API Electron Desktop App
+
+This directory contains the Electron wrapper for New API, providing a native desktop application with system tray support for Windows, macOS, and Linux.
+
+## Prerequisites
+
+### 1. Go Binary (Required)
+The Electron app requires the compiled Go binary to function. You have two options:
+
+**Option A: Use existing binary (without Go installed)**
+```bash
+# If you have a pre-built binary (e.g., new-api-macos)
+cp ../new-api-macos ../new-api
+```
+
+**Option B: Build from source (requires Go)**
+TODO
+
+### 3. Electron Dependencies
+```bash
+cd electron
+npm install
+```
+
+## Development
+
+Run the app in development mode:
+```bash
+npm start
+```
+
+This will:
+- Start the Go backend on port 3000
+- Open an Electron window with DevTools enabled
+- Create a system tray icon (menu bar on macOS)
+- Store database in `../data/new-api.db`
+
+## Building for Production
+
+### Quick Build
+```bash
+# Ensure Go binary exists in parent directory
+ls ../new-api  # Should exist
+
+# Build for current platform
+npm run build
+
+# Platform-specific builds
+npm run build:mac    # Creates .dmg and .zip
+npm run build:win    # Creates .exe installer
+npm run build:linux  # Creates .AppImage and .deb
+```
+
+### Build Output
+- Built applications are in `electron/dist/`
+- macOS: `.dmg` (installer) and `.zip` (portable)
+- Windows: `.exe` (installer) and portable exe
+- Linux: `.AppImage` and `.deb`
+
+## Configuration
+
+### Port
+Default port is 3000. To change, edit `main.js`:
+```javascript
+const PORT = 3000; // Change to desired port
+```
+
+### Database Location
+- **Development**: `../data/new-api.db` (project directory)
+- **Production**:
+  - macOS: `~/Library/Application Support/New API/data/`
+  - Windows: `%APPDATA%/New API/data/`
+  - Linux: `~/.config/New API/data/`

electron/build.sh

+#!/bin/bash
+
+set -e
+
+echo "Building New API Electron App..."
+
+echo "Step 1: Building frontend..."
+cd ../web
+DISABLE_ESLINT_PLUGIN='true' bun run build
+cd ../electron
+
+echo "Step 2: Building Go backend..."
+cd ..
+
+if [[ "$OSTYPE" == "darwin"* ]]; then
+    echo "Building for macOS..."
+    CGO_ENABLED=1 go build -ldflags="-s -w" -o new-api
+    cd electron
+    npm install
+    npm run build:mac
+elif [[ "$OSTYPE" == "linux-gnu"* ]]; then
+    echo "Building for Linux..."
+    CGO_ENABLED=1 go build -ldflags="-s -w" -o new-api
+    cd electron
+    npm install
+    npm run build:linux
+elif [[ "$OSTYPE" == "msys" || "$OSTYPE" == "cygwin" || "$OSTYPE" == "win32" ]]; then
+    echo "Building for Windows..."
+    CGO_ENABLED=1 go build -ldflags="-s -w" -o new-api.exe
+    cd electron
+    npm install
+    npm run build:win
+else
+    echo "Unknown OS, building for current platform..."
+    CGO_ENABLED=1 go build -ldflags="-s -w" -o new-api
+    cd electron
+    npm install
+    npm run build
+fi
+
+echo "Build complete! Check electron/dist/ for output."
\ No newline at end of file

electron/create-tray-icon.js

+// Create a simple tray icon for macOS
+// Run: node create-tray-icon.js
+
+const fs = require('fs');
+const { createCanvas } = require('canvas');
+
+function createTrayIcon() {
+  // For macOS, we'll use a Template image (black and white)
+  // Size should be 22x22 for Retina displays (@2x would be 44x44)
+  const canvas = createCanvas(22, 22);
+  const ctx = canvas.getContext('2d');
+
+  // Clear canvas
+  ctx.clearRect(0, 0, 22, 22);
+
+  // Draw a simple "API" icon
+  ctx.fillStyle = '#000000';
+  ctx.font = 'bold 10px system-ui';
+  ctx.textAlign = 'center';
+  ctx.textBaseline = 'middle';
+  ctx.fillText('API', 11, 11);
+
+  // Save as PNG
+  const buffer = canvas.toBuffer('image/png');
+  fs.writeFileSync('tray-icon.png', buffer);
+
+  // For Template images on macOS (will adapt to menu bar theme)
+  fs.writeFileSync('tray-iconTemplate.png', buffer);
+  fs.writeFileSync('tray-iconTemplate@2x.png', buffer);
+
+  console.log('Tray icon created successfully!');
+}
+
+// Check if canvas is installed
+try {
+  createTrayIcon();
+} catch (err) {
+  console.log('Canvas module not installed.');
+  console.log('For now, creating a placeholder. Install canvas with: npm install canvas');
+
+  // Create a minimal 1x1 transparent PNG as placeholder
+  const minimalPNG = Buffer.from([
+    0x89, 0x50, 0x4E, 0x47, 0x0D, 0x0A, 0x1A, 0x0A,
+    0x00, 0x00, 0x00, 0x0D, 0x49, 0x48, 0x44, 0x52,
+    0x00, 0x00, 0x00, 0x01, 0x00, 0x00, 0x00, 0x01,
+    0x01, 0x03, 0x00, 0x00, 0x00, 0x25, 0xDB, 0x56,
+    0xCA, 0x00, 0x00, 0x00, 0x03, 0x50, 0x4C, 0x54,
+    0x45, 0x00, 0x00, 0x00, 0xA7, 0x7A, 0x3D, 0xDA,
+    0x00, 0x00, 0x00, 0x01, 0x74, 0x52, 0x4E, 0x53,
+    0x00, 0x40, 0xE6, 0xD8, 0x66, 0x00, 0x00, 0x00,
+    0x0A, 0x49, 0x44, 0x41, 0x54, 0x08, 0x1D, 0x62,
+    0x00, 0x00, 0x00, 0x00, 0x00, 0x01, 0x00, 0x00,
+    0x00, 0x01, 0x0A, 0x2D, 0xCB, 0x59, 0x00, 0x00,
+    0x00, 0x00, 0x49, 0x45, 0x4E, 0x44, 0xAE, 0x42,
+    0x60, 0x82
+  ]);
+
+  fs.writeFileSync('tray-icon.png', minimalPNG);
+  console.log('Created placeholder tray icon.');
+}
\ No newline at end of file

electron/entitlements.mac.plist

+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+    <key>com.apple.security.cs.allow-unsigned-executable-memory</key>
+    <true/>
+    <key>com.apple.security.cs.allow-jit</key>
+    <true/>
+    <key>com.apple.security.cs.disable-library-validation</key>
+    <true/>
+    <key>com.apple.security.cs.allow-dyld-environment-variables</key>
+    <true/>
+    <key>com.apple.security.network.client</key>
+    <true/>
+    <key>com.apple.security.network.server</key>
+    <true/>
+</dict>
+</plist>
\ No newline at end of file

electron/main.js

+const { app, BrowserWindow, dialog, Tray, Menu, shell } = require('electron');
+const { spawn } = require('child_process');
+const path = require('path');
+const http = require('http');
+const fs = require('fs');
+
+let mainWindow;
+let serverProcess;
+let tray = null;
+let serverErrorLogs = [];
+const PORT = 3000;
+const DEV_FRONTEND_PORT = 5173; // Vite dev server port
+
+// 保存日志到文件并打开
+function saveAndOpenErrorLog() {
+  try {
+    const timestamp = new Date().toISOString().replace(/[:.]/g, '-');
+    const logFileName = `new-api-crash-${timestamp}.log`;
+    const logDir = app.getPath('logs');
+    const logFilePath = path.join(logDir, logFileName);
+    
+    // 确保日志目录存在
+    if (!fs.existsSync(logDir)) {
+      fs.mkdirSync(logDir, { recursive: true });
+    }
+    
+    // 写入日志
+    const logContent = `New API 崩溃日志
+生成时间: ${new Date().toLocaleString('zh-CN')}
+平台: ${process.platform}
+架构: ${process.arch}
+应用版本: ${app.getVersion()}
+
+━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+完整错误日志:
+
+${serverErrorLogs.join('\n')}
+
+━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+日志文件位置: ${logFilePath}
+`;
+    
+    fs.writeFileSync(logFilePath, logContent, 'utf8');
+    
+    // 打开日志文件
+    shell.openPath(logFilePath).then((error) => {
+      if (error) {
+        console.error('Failed to open log file:', error);
+        // 如果打开文件失败，至少显示文件位置
+        shell.showItemInFolder(logFilePath);
+      }
+    });
+    
+    return logFilePath;
+  } catch (err) {
+    console.error('Failed to save error log:', err);
+    return null;
+  }
+}
+
+// 分析错误日志，识别常见错误并提供解决方案
+function analyzeError(errorLogs) {
+  const allLogs = errorLogs.join('\n');
+  
+  // 检测端口占用错误
+  if (allLogs.includes('failed to start HTTP server') || 
+      allLogs.includes('bind: address already in use') ||
+      allLogs.includes('listen tcp') && allLogs.includes('bind: address already in use')) {
+    return {
+      type: '端口被占用',
+      title: '端口 ' + PORT + ' 被占用',
+      message: '无法启动服务器，端口已被其他程序占用',
+      solution: `可能的解决方案：\n\n1. 关闭占用端口 ${PORT} 的其他程序\n2. 检查是否已经运行了另一个 New API 实例\n3. 使用以下命令查找占用端口的进程：\n   Mac/Linux: lsof -i :${PORT}\n   Windows: netstat -ano | findstr :${PORT}\n4. 重启电脑以释放端口`
+    };
+  }
+  
+  // 检测数据库错误
+  if (allLogs.includes('database is locked') || 
+      allLogs.includes('unable to open database')) {
+    return {
+      type: '数据文件被占用',
+      title: '无法访问数据文件',
+      message: '应用的数据文件正被其他程序占用',
+      solution: '可能的解决方案：\n\n1. 检查是否已经打开了另一个 New API 窗口\n   - 查看任务栏/Dock 中是否有其他 New API 图标\n   - 查看系统托盘（Windows）或菜单栏（Mac）中是否有 New API 图标\n\n2. 如果刚刚关闭过应用，请等待 10 秒后再试\n\n3. 重启电脑以释放被占用的文件\n\n4. 如果问题持续，可以尝试：\n   - 退出所有 New API 实例\n   - 删除数据目录中的临时文件（.db-shm 和 .db-wal）\n   - 重新启动应用'
+    };
+  }
+  
+  // 检测权限错误
+  if (allLogs.includes('permission denied') || 
+      allLogs.includes('access denied')) {
+    return {
+      type: '权限错误',
+      title: '权限不足',
+      message: '程序没有足够的权限执行操作',
+      solution: '可能的解决方案：\n\n1. 以管理员/root权限运行程序\n2. 检查数据目录的读写权限\n3. 检查可执行文件的权限\n4. 在 Mac 上，检查安全性与隐私设置'
+    };
+  }
+  
+  // 检测网络错误
+  if (allLogs.includes('network is unreachable') || 
+      allLogs.includes('no such host') ||
+      allLogs.includes('connection refused')) {
+    return {
+      type: '网络错误',
+      title: '网络连接失败',
+      message: '无法建立网络连接',
+      solution: '可能的解决方案：\n\n1. 检查网络连接是否正常\n2. 检查防火墙设置\n3. 检查代理配置\n4. 确认目标服务器地址正确'
+    };
+  }
+  
+  // 检测配置文件错误
+  if (allLogs.includes('invalid configuration') || 
+      allLogs.includes('failed to parse config') ||
+      allLogs.includes('yaml') || allLogs.includes('json') && allLogs.includes('parse')) {
+    return {
+      type: '配置错误',
+      title: '配置文件错误',
+      message: '配置文件格式不正确或包含无效配置',
+      solution: '可能的解决方案：\n\n1. 检查配置文件格式是否正确\n2. 恢复默认配置\n3. 删除配置文件让程序重新生成\n4. 查看文档了解正确的配置格式'
+    };
+  }
+  
+  // 检测内存不足
+  if (allLogs.includes('out of memory') || 
+      allLogs.includes('cannot allocate memory')) {
+    return {
+      type: '内存不足',
+      title: '系统内存不足',
+      message: '程序运行时内存不足',
+      solution: '可能的解决方案：\n\n1. 关闭其他占用内存的程序\n2. 增加系统可用内存\n3. 重启电脑释放内存\n4. 检查是否存在内存泄漏'
+    };
+  }
+  
+  // 检测文件不存在错误
+  if (allLogs.includes('no such file or directory') || 
+      allLogs.includes('cannot find the file')) {
+    return {
+      type: '文件缺失',
+      title: '找不到必需的文件',
+      message: '缺少程序运行所需的文件',
+      solution: '可能的解决方案：\n\n1. 重新安装应用程序\n2. 检查安装目录是否完整\n3. 确保所有依赖文件都存在\n4. 检查文件路径是否正确'
+    };
+  }
+  
+  return null;
+}
+
+function getBinaryPath() {
+  const isDev = process.env.NODE_ENV === 'development';
+  const platform = process.platform;
+
+  if (isDev) {
+    const binaryName = platform === 'win32' ? 'new-api.exe' : 'new-api';
+    return path.join(__dirname, '..', binaryName);
+  }
+
+  let binaryName;
+  switch (platform) {
+    case 'win32':
+      binaryName = 'new-api.exe';
+      break;
+    case 'darwin':
+      binaryName = 'new-api';
+      break;
+    case 'linux':
+      binaryName = 'new-api';
+      break;
+    default:
+      binaryName = 'new-api';
+  }
+
+  return path.join(process.resourcesPath, 'bin', binaryName);
+}
+
+// Check if a server is available with retry logic
+function checkServerAvailability(port, maxRetries = 30, retryDelay = 1000) {
+  return new Promise((resolve, reject) => {
+    let currentAttempt = 0;
+    
+    const tryConnect = () => {
+      currentAttempt++;
+      
+      if (currentAttempt % 5 === 1 && currentAttempt > 1) {
+        console.log(`Attempting to connect to port ${port}... (attempt ${currentAttempt}/${maxRetries})`);
+      }
+      
+      const req = http.get({
+        hostname: '127.0.0.1', // Use IPv4 explicitly instead of 'localhost' to avoid IPv6 issues
+        port: port,
+        timeout: 10000
+      }, (res) => {
+        // Server responded, connection successful
+        req.destroy();
+        console.log(`✓ Successfully connected to port ${port} (status: ${res.statusCode})`);
+        resolve();
+      });
+
+      req.on('error', (err) => {
+        if (currentAttempt >= maxRetries) {
+          reject(new Error(`Failed to connect to port ${port} after ${maxRetries} attempts: ${err.message}`));
+        } else {
+          setTimeout(tryConnect, retryDelay);
+        }
+      });
+
+      req.on('timeout', () => {
+        req.destroy();
+        if (currentAttempt >= maxRetries) {
+          reject(new Error(`Connection timeout on port ${port} after ${maxRetries} attempts`));
+        } else {
+          setTimeout(tryConnect, retryDelay);
+        }
+      });
+    };
+    
+    tryConnect();
+  });
+}
+
+function startServer() {
+  return new Promise((resolve, reject) => {
+    const isDev = process.env.NODE_ENV === 'development';
+    
+    if (isDev) {
+      // 开发模式：假设开发者手动启动了 Go 后端和前端开发服务器
+      // 只需要等待前端开发服务器就绪
+      console.log('Development mode: skipping server startup');
+      console.log('Please make sure you have started:');
+      console.log('  1. Go backend: go run main.go (port 3000)');
+      console.log('  2. Frontend dev server: cd web && bun dev (port 5173)');
+      console.log('');
+      console.log('Checking if servers are running...');
+      
+      // First check if both servers are accessible
+      checkServerAvailability(DEV_FRONTEND_PORT)
+        .then(() => {
+          console.log('✓ Frontend dev server is accessible on port 5173');
+          resolve();
+        })
+        .catch((err) => {
+          console.error(`✗ Cannot connect to frontend dev server on port ${DEV_FRONTEND_PORT}`);
+          console.error('Please make sure the frontend dev server is running:');
+          console.error('  cd web && bun dev');
+          reject(err);
+        });
+      return;
+    }
+
+    // 生产模式：启动二进制服务器
+    const env = { ...process.env, PORT: PORT.toString() };
+    const userDataPath = app.getPath('userData');
+    const dataDir = path.join(userDataPath, 'data');
+
+    if (!fs.existsSync(dataDir)) {
+      fs.mkdirSync(dataDir, { recursive: true });
+    }
+
+    env.SQLITE_PATH = path.join(dataDir, 'new-api.db');
+    
+    console.log('━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━');
+    console.log('📁 您的数据存储位置：');
+    console.log('   ' + dataDir);
+    console.log('   💡 备份提示：复制此目录即可备份所有数据');
+    console.log('━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━');
+
+    const binaryPath = getBinaryPath();
+    const workingDir = process.resourcesPath;
+    
+    console.log('Starting server from:', binaryPath);
+
+    serverProcess = spawn(binaryPath, [], {
+      env,
+      cwd: workingDir
+    });
+
+    serverProcess.stdout.on('data', (data) => {
+      console.log(`Server: ${data}`);
+    });
+
+    serverProcess.stderr.on('data', (data) => {
+      const errorMsg = data.toString();
+      console.error(`Server Error: ${errorMsg}`);
+      serverErrorLogs.push(errorMsg);
+      // 只保留最近的100条错误日志
+      if (serverErrorLogs.length > 100) {
+        serverErrorLogs.shift();
+      }
+    });
+
+    serverProcess.on('error', (err) => {
+      console.error('Failed to start server:', err);
+      reject(err);
+    });
+
+    serverProcess.on('close', (code) => {
+      console.log(`Server process exited with code ${code}`);
+      
+      // 如果退出代码不是0，说明服务器异常退出
+      if (code !== 0 && code !== null) {
+        const errorDetails = serverErrorLogs.length > 0 
+          ? serverErrorLogs.slice(-20).join('\n') 
+          : '没有捕获到错误日志';
+        
+        // 分析错误类型
+        const knownError = analyzeError(serverErrorLogs);
+        
+        let dialogOptions;
+        if (knownError) {
+          // 识别到已知错误，显示友好的错误信息和解决方案
+          dialogOptions = {
+            type: 'error',
+            title: knownError.title,
+            message: knownError.message,
+            detail: `${knownError.solution}\n\n━━━━━━━━━━━━━━━━━━━━━━\n\n退出代码: ${code}\n\n错误类型: ${knownError.type}\n\n最近的错误日志:\n${errorDetails}`,
+            buttons: ['退出应用', '查看完整日志'],
+            defaultId: 0,
+            cancelId: 0
+          };
+        } else {
+          // 未识别的错误，显示通用错误信息
+          dialogOptions = {
+            type: 'error',
+            title: '服务器崩溃',
+            message: '服务器进程异常退出',
+            detail: `退出代码: ${code}\n\n最近的错误信息:\n${errorDetails}`,
+            buttons: ['退出应用', '查看完整日志'],
+            defaultId: 0,
+            cancelId: 0
+          };
+        }
+        
+        dialog.showMessageBox(dialogOptions).then((result) => {
+          if (result.response === 1) {
+            // 用户选择查看详情，保存并打开日志文件
+            const logPath = saveAndOpenErrorLog();
+            
+            // 显示确认对话框
+            const confirmMessage = logPath 
+              ? `日志已保存到:\n${logPath}\n\n日志文件已在默认文本编辑器中打开。\n\n点击"退出"关闭应用程序。`
+              : '日志保存失败，但已在控制台输出。\n\n点击"退出"关闭应用程序。';
+            
+            dialog.showMessageBox({
+              type: 'info',
+              title: '日志已保存',
+              message: confirmMessage,
+              buttons: ['退出'],
+              defaultId: 0
+            }).then(() => {
+              app.isQuitting = true;
+              app.quit();
+            });
+            
+            // 同时在控制台输出
+            console.log('=== 完整错误日志 ===');
+            console.log(serverErrorLogs.join('\n'));
+          } else {
+            // 用户选择直接退出
+            app.isQuitting = true;
+            app.quit();
+          }
+        });
+      } else {
+        // 正常退出（code为0或null），直接关闭窗口
+        if (mainWindow && !mainWindow.isDestroyed()) {
+          mainWindow.close();
+        }
+      }
+    });
+
+    checkServerAvailability(PORT)
+      .then(() => {
+        console.log('✓ Backend server is accessible on port 3000');
+        resolve();
+      })
+      .catch((err) => {
+        console.error('✗ Failed to connect to backend server');
+        reject(err);
+      });
+  });
+}
+
+function createWindow() {
+  const isDev = process.env.NODE_ENV === 'development';
+  const loadPort = isDev ? DEV_FRONTEND_PORT : PORT;
+  
+  mainWindow = new BrowserWindow({
+    width: 1080,
+    height: 720,
+    webPreferences: {
+      preload: path.join(__dirname, 'preload.js'),
+      nodeIntegration: false,
+      contextIsolation: true
+    },
+    title: 'New API',
+    icon: path.join(__dirname, 'icon.png')
+  });
+
+  mainWindow.loadURL(`http://127.0.0.1:${loadPort}`);
+  
+  console.log(`Loading from: http://127.0.0.1:${loadPort}`);
+
+  if (isDev) {
+    mainWindow.webContents.openDevTools();
+  }
+
+  // Close to tray instead of quitting
+  mainWindow.on('close', (event) => {
+    if (!app.isQuitting) {
+      event.preventDefault();
+      mainWindow.hide();
+      if (process.platform === 'darwin') {
+        app.dock.hide();
+      }
+    }
+  });
+
+  mainWindow.on('closed', () => {
+    mainWindow = null;
+  });
+}
+
+function createTray() {
+  // Use template icon for macOS (black with transparency, auto-adapts to theme)
+  // Use colored icon for Windows
+  const trayIconPath = process.platform === 'darwin'
+    ? path.join(__dirname, 'tray-iconTemplate.png')
+    : path.join(__dirname, 'tray-icon-windows.png');
+
+  tray = new Tray(trayIconPath);
+
+  const contextMenu = Menu.buildFromTemplate([
+    {
+      label: 'Show New API',
+      click: () => {
+        if (mainWindow === null) {
+          createWindow();
+        } else {
+          mainWindow.show();
+          if (process.platform === 'darwin') {
+            app.dock.show();
+          }
+        }
+      }
+    },
+    { type: 'separator' },
+    {
+      label: 'Quit',
+      click: () => {
+        app.isQuitting = true;
+        app.quit();
+      }
+    }
+  ]);
+
+  tray.setToolTip('New API');
+  tray.setContextMenu(contextMenu);
+
+  // On macOS, clicking the tray icon shows the window
+  tray.on('click', () => {
+    if (mainWindow === null) {
+      createWindow();
+    } else {
+      mainWindow.isVisible() ? mainWindow.hide() : mainWindow.show();
+      if (mainWindow.isVisible() && process.platform === 'darwin') {
+        app.dock.show();
+      }
+    }
+  });
+}
+
+app.whenReady().then(async () => {
+  try {
+    await startServer();
+    createTray();
+    createWindow();
+  } catch (err) {
+    console.error('Failed to start application:', err);
+    
+    // 分析启动失败的错误
+    const knownError = analyzeError(serverErrorLogs);
+    
+    if (knownError) {
+      dialog.showMessageBox({
+        type: 'error',
+        title: knownError.title,
+        message: `启动失败: ${knownError.message}`,
+        detail: `${knownError.solution}\n\n━━━━━━━━━━━━━━━━━━━━━━\n\n错误信息: ${err.message}\n\n错误类型: ${knownError.type}`,
+        buttons: ['退出', '查看完整日志'],
+        defaultId: 0,
+        cancelId: 0
+      }).then((result) => {
+        if (result.response === 1) {
+          // 用户选择查看日志
+          const logPath = saveAndOpenErrorLog();
+          
+          const confirmMessage = logPath 
+            ? `日志已保存到:\n${logPath}\n\n日志文件已在默认文本编辑器中打开。\n\n点击"退出"关闭应用程序。`
+            : '日志保存失败，但已在控制台输出。\n\n点击"退出"关闭应用程序。';
+          
+          dialog.showMessageBox({
+            type: 'info',
+            title: '日志已保存',
+            message: confirmMessage,
+            buttons: ['退出'],
+            defaultId: 0
+          }).then(() => {
+            app.quit();
+          });
+          
+          console.log('=== 完整错误日志 ===');
+          console.log(serverErrorLogs.join('\n'));
+        } else {
+          app.quit();
+        }
+      });
+    } else {
+      dialog.showMessageBox({
+        type: 'error',
+        title: '启动失败',
+        message: '无法启动服务器',
+        detail: `错误信息: ${err.message}\n\n请检查日志获取更多信息。`,
+        buttons: ['退出', '查看完整日志'],
+        defaultId: 0,
+        cancelId: 0
+      }).then((result) => {
+        if (result.response === 1) {
+          // 用户选择查看日志
+          const logPath = saveAndOpenErrorLog();
+          
+          const confirmMessage = logPath 
+            ? `日志已保存到:\n${logPath}\n\n日志文件已在默认文本编辑器中打开。\n\n点击"退出"关闭应用程序。`
+            : '日志保存失败，但已在控制台输出。\n\n点击"退出"关闭应用程序。';
+          
+          dialog.showMessageBox({
+            type: 'info',
+            title: '日志已保存',
+            message: confirmMessage,
+            buttons: ['退出'],
+            defaultId: 0
+          }).then(() => {
+            app.quit();
+          });
+          
+          console.log('=== 完整错误日志 ===');
+          console.log(serverErrorLogs.join('\n'));
+        } else {
+          app.quit();
+        }
+      });
+    }
+  }
+});
+
+app.on('window-all-closed', () => {
+  // Don't quit when window is closed, keep running in tray
+  // Only quit when explicitly choosing Quit from tray menu
+});
+
+app.on('activate', () => {
+  if (BrowserWindow.getAllWindows().length === 0) {
+    createWindow();
+  }
+});
+
+app.on('before-quit', (event) => {
+  if (serverProcess) {
+    event.preventDefault();
+
+    console.log('Shutting down server...');
+    serverProcess.kill('SIGTERM');
+
+    setTimeout(() => {
+      if (serverProcess) {
+        serverProcess.kill('SIGKILL');
+      }
+      app.exit();
+    }, 5000);
+
+    serverProcess.on('close', () => {
+      serverProcess = null;
+      app.exit();
+    });
+  }
+});
\ No newline at end of file

electron/package.json

+{
+  "name": "new-api-electron",
+  "version": "1.0.0",
+  "description": "New API - AI Model Gateway Desktop Application",
+  "main": "main.js",
+  "scripts": {
+    "start-app": "electron .",
+    "dev-app": "cross-env NODE_ENV=development electron .",
+    "build": "electron-builder",
+    "build:mac": "electron-builder --mac",
+    "build:win": "electron-builder --win",
+    "build:linux": "electron-builder --linux"
+  },
+  "keywords": [
+    "ai",
+    "api",
+    "gateway",
+    "openai",
+    "claude"
+  ],
+  "author": "QuantumNous",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/QuantumNous/new-api"
+  },
+  "devDependencies": {
+    "cross-env": "^7.0.3",
+    "electron": "28.3.3",
+    "electron-builder": "^24.9.1"
+  },
+  "build": {
+    "appId": "com.newapi.desktop",
+    "productName": "New API",
+    "publish": null,
+    "directories": {
+      "output": "dist"
+    },
+    "files": [
+      "main.js",
+      "preload.js",
+      "icon.png",
+      "tray-iconTemplate.png",
+      "tray-iconTemplate@2x.png",
+      "tray-icon-windows.png"
+    ],
+    "mac": {
+      "category": "public.app-category.developer-tools",
+      "icon": "icon.png",
+      "identity": null,
+      "hardenedRuntime": false,
+      "gatekeeperAssess": false,
+      "entitlements": "entitlements.mac.plist",
+      "entitlementsInherit": "entitlements.mac.plist",
+      "target": [
+        "dmg",
+        "zip"
+      ],
+      "extraResources": [
+        {
+          "from": "../new-api",
+          "to": "bin/new-api"
+        },
+        {
+          "from": "../web/dist",
+          "to": "web/dist"
+        }
+      ]
+    },
+    "win": {
+      "icon": "icon.png",
+      "target": [
+        "nsis",
+        "portable"
+      ],
+      "extraResources": [
+        {
+          "from": "../new-api.exe",
+          "to": "bin/new-api.exe"
+        }
+      ]
+    },
+    "linux": {
+      "icon": "icon.png",
+      "target": [
+        "AppImage",
+        "deb"
+      ],
+      "category": "Development",
+      "extraResources": [
+        {
+          "from": "../new-api",
+          "to": "bin/new-api"
+        }
+      ]
+    },
+    "nsis": {
+      "oneClick": false,
+      "allowToChangeInstallationDirectory": true
+    }
+  }
+}
\ No newline at end of file

electron/preload.js

+const { contextBridge } = require('electron');
+
+// 获取数据目录路径（用于显示给用户）
+// 使用字符串拼接而不是 path.join 避免模块依赖问题
+function getDataDirPath() {
+  const platform = process.platform;
+  const homeDir = process.env.HOME || process.env.USERPROFILE || '';
+  
+  switch (platform) {
+    case 'darwin':
+      return `${homeDir}/Library/Application Support/New API/data`;
+    case 'win32': {
+      const appData = process.env.APPDATA || `${homeDir}\\AppData\\Roaming`;
+      return `${appData}\\New API\\data`;
+    }
+    case 'linux':
+      return `${homeDir}/.config/New API/data`;
+    default:
+      return `${homeDir}/.new-api/data`;
+  }
+}
+
+contextBridge.exposeInMainWorld('electron', {
+  isElectron: true,
+  version: process.versions.electron,
+  platform: process.platform,
+  versions: process.versions,
+  dataDir: getDataDirPath()
+});
\ No newline at end of file

web/src/components/setup/components/steps/DatabaseStep.jsx

@@ -25,29 +25,54 @@ import { Banner } from '@douyinfe/semi-ui';
  * 显示当前数据库类型和相关警告信息
  * 显示当前数据库类型和相关警告信息
  */
  */
 const DatabaseStep = ({ setupStatus, renderNavigationButtons, t }) => {
 const DatabaseStep = ({ setupStatus, renderNavigationButtons, t }) => {
+  // 检测是否在 Electron 环境中运行
+  const isElectron = typeof window !== 'undefined' && window.electron?.isElectron;
+  
   return (
   return (
     <>
     <>
       {/* 数据库警告 */}
       {/* 数据库警告 */}
       {setupStatus.database_type === 'sqlite' && (
       {setupStatus.database_type === 'sqlite' && (
         <Banner
         <Banner
-          type='warning'
+          type={isElectron ? 'info' : 'warning'}
           closeIcon={null}
           closeIcon={null}
-          title={t('数据库警告')}
+          title={isElectron ? t('本地数据存储') : t('数据库警告')}
           description={
           description={
-            <div>
-              <p>
-                {t(
-                  '您正在使用 SQLite 数据库。如果您在容器环境中运行，请确保已正确设置数据库文件的持久化映射，否则容器重启后所有数据将丢失！',
+            isElectron ? (
+              <div>
+                <p>
+                  {t(
+                    '您的数据将安全地存储在本地计算机上。所有配置、用户信息和使用记录都会自动保存，关闭应用后不会丢失。',
+                  )}
+                </p>
+                {window.electron?.dataDir && (
+                  <p className='mt-2 text-sm opacity-80'>
+                    <strong>{t('数据存储位置：')}</strong>
+                    <br />
+                    <code className='bg-gray-100 dark:bg-gray-800 px-2 py-1 rounded'>
+                      {window.electron.dataDir}
+                    </code>
+                  </p>
                 )}
                 )}
-              </p>
-              <p className='mt-1'>
-                <strong>
+                <p className='mt-2 text-sm opacity-70'>
+                  💡 {t('提示：如需备份数据，只需复制上述目录即可')}
+                </p>
+              </div>
+            ) : (
+              <div>
+                <p>
                   {t(
                   {t(
-                    '建议在生产环境中使用 MySQL 或 PostgreSQL 数据库，或确保 SQLite 数据库文件已映射到宿主机的持久化存储。',
+                    '您正在使用 SQLite 数据库。如果您在容器环境中运行，请确保已正确设置数据库文件的持久化映射，否则容器重启后所有数据将丢失！',
                   )}
                   )}
-                </strong>
-              </p>
-            </div>
+                </p>
+                <p className='mt-1'>
+                  <strong>
+                    {t(
+                      '建议在生产环境中使用 MySQL 或 PostgreSQL 数据库，或确保 SQLite 数据库文件已映射到宿主机的持久化存储。',
+                    )}
+                  </strong>
+                </p>
+              </div>
+            )
           }
           }
           className='!rounded-lg'
           className='!rounded-lg'
           fullMode={false}
           fullMode={false}