打造高效ChatGPT桌面工具：Electron与API调用的最佳实践

1次阅读

没有评论

共计 2300 个字符，预计需要花费 6 分钟才能阅读完成。

在构建基于 ChatGPT API 的桌面应用时，开发者常遇到以下几个典型问题：

跨平台兼容性 ：需要支持 Windows、macOS 和 Linux 等多个操作系统，但原生开发成本高
API 调用效率 ：频繁的网络请求可能导致响应延迟或 API 配额耗尽
用户体验 ：长时间的等待响应会导致界面卡顿，影响用户满意度
数据持久化 ：对话历史需要本地存储以提升用户体验
开发效率 ：希望使用熟悉的 Web 技术栈快速构建应用

对比主流跨平台方案：

Electron：
优点：使用 HTML/CSS/JS 技术栈，跨平台支持好，社区生态丰富
缺点：应用体积较大，内存占用相对高
Tauri：
优点：更轻量级，性能更好
缺点：生态相对不成熟，对 Node.js 模块支持有限
Flutter Desktop：
优点：高性能，一致 UI
缺点：Dart 学习曲线，与 Web 生态整合度低

综合来看，Electron 凭借其成熟度和灵活性成为最佳选择，特别适合需要快速迭代的 AI 应用开发。

// chatService.js
const axios = require('axios');
const {ipcRenderer} = require('electron');

class ChatService {constructor(apiKey) {
    this.client = axios.create({
      baseURL: 'https://api.openai.com/v1',
      headers: {'Authorization': `Bearer ${apiKey}` }
    });
  }

  async sendMessage(messages) {
    try {
      const response = await this.client.post('/chat/completions', {
        model: 'gpt-3.5-turbo',
        messages,
        temperature: 0.7
      });

      return response.data.choices[0].message.content;
    } catch (error) {console.error('API 调用失败:', error);
      throw error;
    }
  }
}

module.exports = ChatService;

// cacheManager.js
const fs = require('fs');
const path = require('path');

class CacheManager {constructor(app) {this.cachePath = path.join(app.getPath('userData'), 'conversationCache.json');
    this.cache = this.loadCache();}

  loadCache() {
    try {return fs.existsSync(this.cachePath) 
        ? JSON.parse(fs.readFileSync(this.cachePath))
        : {};} catch (error) {console.error('缓存加载失败:', error);
      return {};}
  }

  saveConversation(userId, messages) {this.cache[userId] = messages;
    fs.writeFileSync(this.cachePath, JSON.stringify(this.cache));
  }
}

// main.js (主进程)
const {app, BrowserWindow, ipcMain} = require('electron');
const {Worker} = require('worker_threads');

ipcMain.handle('process-task', (event, data) => {return new Promise((resolve) => {const worker = new Worker('./worker.js', { workerData: data});

    worker.on('message', resolve);
    worker.on('error', (error) => {console.error('Worker error:', error);
      resolve({error: error.message});
    });
  });
});

// worker.js
const {parentPort, workerData} = require('worker_threads');

// 执行 CPU 密集型任务
function processData(data) {
  // ... 处理逻辑
  return result;
}

parentPort.postMessage(processData(workerData));