AI Browser：我用 CC 做了个桌面版 Manus

┌──────────────────────────────────────────────┐│            Web UI (Next.js)                  ││                                              ││  ┌──────────┐ ┌──────────┐ ┌──────────┐    ││  │  Home    │ │  Main    │ │ History  │    ││  │  页面    │ │  页面    │ │  页面    │    ││  └──────────┘ └──────────┘ └──────────┘    │└──────────────────┬───────────────────────────┘                   │ IPC┌──────────────────▼───────────────────────────┐│        Electron Main Process                 ││                                              ││  ┌────────────────────────────────────┐     ││  │   Eko Service (AI Agent Core)      │     ││  │                                    │     ││  │  ┌──────────┐    ┌──────────┐     │     ││  │  │ Planner  │───▶│ Executor │     │     ││  │  └──────────┘    └──────────┘     │     ││  └────────────────────────────────────┘     ││                                              ││  ┌────────────────────────────────────┐     ││  │         Browser Agent              │     ││  │  - Navigate  - Click  - Extract    │     ││  └────────────────────────────────────┘     ││                                              ││  ┌────────────────────────────────────┐     ││  │         File Agent                 │     ││  │  - Read  - Write  - Search         │     ││  └────────────────────────────────────┘     │└──────────────────────────────────────────────┘

用户输入任务    ↓Next.js API (/api/mcp/message)    ↓IPC 调用 Electron 主进程    ↓Eko Service 解析任务    ↓生成执行计划 (多步骤)    ↓调用工具 (Browser Agent / File Agent)    ↓流式返回结果 (SSE)    ↓前端实时更新 UI    ↓保存到 IndexedDB

// Define a toolconst tool = {  name: "browser_navigate",  description: "Navigate to a specific URL",  parameters: {    type: "object",    properties: {      url: {        type: "string",        description: "The URL to navigate to"      }    },    required: ["url"]  }}
// AI calls the toolawait agent.call(tool, { url: "https://example.com" })

// API Routeexport async function GET(req: Request) {  const stream = new ReadableStream({    async start(controller) {      for await (const chunk of aiResponse) {        const data = `data: ${JSON.stringify(chunk)}\n\n`        controller.enqueue(new TextEncoder().encode(data))      }      controller.close()    }  })
  return new Response(stream, {    headers: {      'Content-Type': 'text/event-stream',      'Cache-Control': 'no-cache',      'Connection': 'keep-alive'    }  })}

// Preload scriptcontextBridge.exposeInMainWorld('electronAPI', {  ekoRun: (task: string) => ipcRenderer.invoke('eko:run', task),  ekoStop: () => ipcRenderer.invoke('eko:stop')})
// Main processipcMain.handle('eko:run', async (event, task) => {  const result = await ekoService.execute(task)  return result})

# 1. 克隆项目git clone [你的仓库地址]cd ai-browser
# 2. 安装依赖pnpm install
# 3. 配置 API Keycp .env.template .env.local# 编辑 .env.local,填入至少一个 AI 服务商的 API Key
# 4. 构建 Electron 依赖# macpnpm run build:deps# windowspnpm run build:deps:win
# 5. 启动开发服务器pnpm run next
# 6. 启动 Electron (新终端)pnpm run electron

# macpnpm run build
# windowspnpm run build:win

用户任务: "帮我采集最新的 AI 新闻并总结"
AI 规划:1. [Browser] 访问 AI 新闻网站2. [Browser] 提取文章列表3. [Browser] 依次访问每篇文章4. [Browser] 提取文章正文5. [AI] 总结文章要点6. [File] 保存总结结果