mirror of
https://github.com/claude-code-best/claude-code.git
synced 2026-06-15 12:55:51 +00:00
docs: 更新文档
This commit is contained in:
@@ -1,243 +1,137 @@
|
|||||||
# Claude in Chrome MCP — 恢复计划
|
# Claude in Chrome — 用户操作指南
|
||||||
|
|
||||||
更新时间:2026-04-03
|
## 1. 功能简介
|
||||||
参考项目:`E:\源码\claude-code-source-main\claude-code-source-main`
|
|
||||||
|
|
||||||
## 1. 功能概述
|
Claude in Chrome 让 Claude Code 直接控制你的 Chrome 浏览器。你可以用自然语言让 Claude 帮你:
|
||||||
|
|
||||||
Claude in Chrome 让 Claude Code CLI 通过 MCP 协议控制用户的 Chrome 浏览器:导航网页、填写表单、截图、录制 GIF、读取 DOM、执行 JS、监控网络请求和控制台日志。
|
- 打开网页、导航、前进后退
|
||||||
|
- 填写表单、上传图片
|
||||||
|
- 截图、录制 GIF
|
||||||
|
- 读取页面内容(DOM、纯文本)
|
||||||
|
- 执行 JavaScript
|
||||||
|
- 监控网络请求和控制台日志
|
||||||
|
- 管理标签页
|
||||||
|
|
||||||
通信方式有两种:
|
## 2. 前置条件
|
||||||
- **本地 Socket**:Chrome 扩展通过 Native Messaging Host 与 CLI 建立 Unix socket 连接
|
|
||||||
- **Bridge WebSocket**:通过 Anthropic 的 bridge 服务中转,支持远程浏览器
|
|
||||||
|
|
||||||
## 2. 完整加载链路
|
| 条件 | 说明 |
|
||||||
|
|------|------|
|
||||||
|
| Claude Code 订阅 | 需要 Claude Pro、Max 或 Team 订阅,浏览器插件功能不向免费用户开放 |
|
||||||
|
| Chrome 浏览器 | 需已安装 Google Chrome |
|
||||||
|
| Claude in Chrome 扩展 | 从 Chrome Web Store 安装(`claude.ai/chrome`) |
|
||||||
|
| Claude Code CLI | 已通过 `bun run dev` 或构建产物运行 |
|
||||||
|
|
||||||
```
|
## 3. 启用方式
|
||||||
CLI 启动
|
|
||||||
│
|
### Dev 模式
|
||||||
▼
|
|
||||||
src/main.tsx:1003
|
```bash
|
||||||
.option('--chrome', 'Enable Claude in Chrome integration')
|
bun run dev -- --chrome
|
||||||
│
|
|
||||||
▼
|
|
||||||
src/main.tsx:1522-1527
|
|
||||||
setChromeFlagOverride(chromeOpts.chrome)
|
|
||||||
│
|
|
||||||
▼
|
|
||||||
src/utils/claudeInChrome/setup.ts
|
|
||||||
shouldEnableClaudeInChrome()
|
|
||||||
├── --chrome flag → true
|
|
||||||
├── --no-chrome flag → false
|
|
||||||
├── 非交互模式 → false
|
|
||||||
├── 环境变量 CLAUDE_CODE_DISABLE_CHROME → false
|
|
||||||
├── 配置 claudeInChromeDefaultEnabled → true/false
|
|
||||||
└── Chrome 扩展已安装 + GrowthBook tengu_chrome_auto_enable → auto
|
|
||||||
│
|
|
||||||
▼
|
|
||||||
src/utils/claudeInChrome/setup.ts
|
|
||||||
setupClaudeInChrome()
|
|
||||||
├── 生成 MCP server 配置
|
|
||||||
└── 返回 mcpConfig + allowedTools
|
|
||||||
│
|
|
||||||
▼
|
|
||||||
src/utils/claudeInChrome/mcpServer.ts
|
|
||||||
import { createClaudeForChromeMcpServer } from '@ant/claude-for-chrome-mcp'
|
|
||||||
│
|
|
||||||
▼
|
|
||||||
packages/@ant/claude-for-chrome-mcp/src/index.ts ← 当前是 STUB
|
|
||||||
export function createClaudeForChromeMcpServer() { return null }
|
|
||||||
export const BROWSER_TOOLS = []
|
|
||||||
```
|
```
|
||||||
|
|
||||||
## 3. 阻塞点清单
|
启动后 Claude 会自动检测 Chrome 扩展是否已安装,并注册浏览器控制工具。
|
||||||
|
|
||||||
| # | 阻塞点 | 位置 | 状态 |
|
### 构建产物
|
||||||
|---|--------|------|------|
|
|
||||||
| ① | `@ant/claude-for-chrome-mcp` 是 stub | `packages/@ant/claude-for-chrome-mcp/src/index.ts` | **6 行空壳,返回 null** |
|
|
||||||
| ② | 缺少完整实现(7 个文件,3038 行) | `packages/@ant/claude-for-chrome-mcp/src/` | 只有 1 个 stub 文件 |
|
|
||||||
|
|
||||||
**不需要任何 feature flag** — `/chrome` 命令无条件注册在 `src/commands.ts:264`。
|
```bash
|
||||||
|
node dist/cli.js --chrome
|
||||||
|
```
|
||||||
|
|
||||||
**不需要改 `src/` 下任何文件** — 以下文件全部与参考项目 0 行差异:
|
### 禁用
|
||||||
- `src/utils/claudeInChrome/setup.ts`
|
|
||||||
- `src/utils/claudeInChrome/mcpServer.ts`
|
|
||||||
- `src/utils/claudeInChrome/common.ts`
|
|
||||||
- `src/utils/claudeInChrome/chromeNativeHost.ts`
|
|
||||||
- `src/utils/claudeInChrome/prompt.ts`
|
|
||||||
- `src/utils/claudeInChrome/setupPortable.ts`
|
|
||||||
- `src/utils/claudeInChrome/toolRendering.tsx`
|
|
||||||
- `src/commands/chrome/index.ts`
|
|
||||||
- `src/commands/chrome/chrome.tsx`(仅 sourcemap 差异)
|
|
||||||
- `src/skills/bundled/claudeInChrome.ts`
|
|
||||||
|
|
||||||
## 4. 参考项目完整实现清单
|
```bash
|
||||||
|
bun run dev -- --no-chrome
|
||||||
|
```
|
||||||
|
|
||||||
参考项目路径:`deps/@ant/claude-for-chrome-mcp/src/`
|
或在 REPL 中通过 `/chrome` 命令切换启用/禁用状态。
|
||||||
|
|
||||||
| 文件 | 行数 | 职责 |
|
### 通过配置默认启用
|
||||||
|------|------|------|
|
|
||||||
| `index.ts` | 15 | 导出入口:`createBridgeClient`、`BROWSER_TOOLS`、`createChromeSocketClient`、`createClaudeForChromeMcpServer`、`localPlatformLabel` + 类型导出 |
|
|
||||||
| `types.ts` | 134 | 类型定义:`Logger`、`PermissionMode`、`BridgeConfig`、`ChromeExtensionInfo`、`ClaudeForChromeContext`、`SocketClient`、`BridgePermissionRequest/Response`、`PermissionOverrides` |
|
|
||||||
| `browserTools.ts` | 546 | 17 个浏览器工具定义(MCP tool schema) |
|
|
||||||
| `mcpServer.ts` | 96 | MCP Server 创建:注册 `ListTools`/`CallTool` handler,选择 socket/bridge 传输 |
|
|
||||||
| `mcpSocketClient.ts` | 493 | Unix Socket 客户端:连接 Chrome Native Messaging Host,JSON-RPC 通信 |
|
|
||||||
| `mcpSocketPool.ts` | 327 | Socket 连接池:多 Chrome profile 支持,按 tabId 路由 |
|
|
||||||
| `bridgeClient.ts` | 1126 | Bridge WebSocket 客户端:连接 Anthropic bridge 服务,扩展发现、设备配对、权限管理 |
|
|
||||||
| `toolCalls.ts` | 301 | 工具调用路由:连接状态处理、结果转换、权限模式切换、浏览器切换 |
|
|
||||||
|
|
||||||
### 17 个浏览器工具
|
在 Claude Code 设置中将 `claudeInChromeDefaultEnabled` 设为 `true`,以后启动无需加 `--chrome` 参数。
|
||||||
|
|
||||||
| 工具名 | 功能 |
|
## 4. 使用流程
|
||||||
|--------|------|
|
|
||||||
| `javascript_tool` | 在页面上下文执行 JavaScript |
|
1. **启动 CLI** — 加 `--chrome` 参数启动 Claude Code
|
||||||
| `read_page` | 获取页面可访问性树(DOM) |
|
2. **确认连接** — REPL 中输入 `/chrome`,查看扩展状态是否显示 "Installed / Connected"
|
||||||
| `find` | 自然语言搜索页面元素 |
|
3. **开始对话** — 正常与 Claude 对话,当需要操作浏览器时直接说,例如:
|
||||||
|
- "打开 https://example.com 并截图"
|
||||||
|
- "在当前页面搜索关键词 xxx"
|
||||||
|
- "填写登录表单,用户名 admin"
|
||||||
|
- "帮我录制当前操作的 GIF"
|
||||||
|
4. **权限审批** — 首次执行浏览器操作时,Claude 会请求你的确认
|
||||||
|
5. **操作完成** — Claude 完成操作后会返回结果(截图、文本、执行结果等)
|
||||||
|
|
||||||
|
## 5. 可用操作
|
||||||
|
|
||||||
|
### 页面交互
|
||||||
|
|
||||||
|
| 操作 | 说明 |
|
||||||
|
|------|------|
|
||||||
|
| `navigate` | 导航到指定 URL,或前进/后退 |
|
||||||
|
| `computer` | 鼠标点击、移动、拖拽、键盘输入、截图等(13 种 action) |
|
||||||
| `form_input` | 填写表单字段 |
|
| `form_input` | 填写表单字段 |
|
||||||
| `computer` | 鼠标键盘操作 + 截图(13 种 action) |
|
| `upload_image` | 上传图片到文件输入框或拖拽区域 |
|
||||||
| `navigate` | URL 导航 / 前进后退 |
|
| `javascript_tool` | 在页面上下文执行 JavaScript |
|
||||||
| `resize_window` | 调整浏览器窗口尺寸 |
|
|
||||||
| `gif_creator` | GIF 录制和导出 |
|
### 页面读取
|
||||||
| `upload_image` | 图片上传到文件输入框或拖拽区域 |
|
|
||||||
| `get_page_text` | 提取页面纯文本 |
|
| 操作 | 说明 |
|
||||||
|
|------|------|
|
||||||
|
| `read_page` | 获取页面可访问性树(DOM 结构) |
|
||||||
|
| `get_page_text` | 提取页面纯文本内容 |
|
||||||
|
| `find` | 用自然语言搜索页面元素 |
|
||||||
|
|
||||||
|
### 标签页管理
|
||||||
|
|
||||||
|
| 操作 | 说明 |
|
||||||
|
|------|------|
|
||||||
| `tabs_context_mcp` | 获取当前标签组信息 |
|
| `tabs_context_mcp` | 获取当前标签组信息 |
|
||||||
| `tabs_create_mcp` | 创建新标签页 |
|
| `tabs_create_mcp` | 创建新标签页 |
|
||||||
| `update_plan` | 向用户提交操作计划供审批 |
|
|
||||||
|
### 监控与调试
|
||||||
|
|
||||||
|
| 操作 | 说明 |
|
||||||
|
|------|------|
|
||||||
| `read_console_messages` | 读取浏览器控制台日志 |
|
| `read_console_messages` | 读取浏览器控制台日志 |
|
||||||
| `read_network_requests` | 读取网络请求 |
|
| `read_network_requests` | 读取网络请求记录 |
|
||||||
|
|
||||||
|
### 其他
|
||||||
|
|
||||||
|
| 操作 | 说明 |
|
||||||
|
|------|------|
|
||||||
|
| `resize_window` | 调整浏览器窗口尺寸 |
|
||||||
|
| `gif_creator` | 录制 GIF 并导出 |
|
||||||
| `shortcuts_list` | 列出可用快捷方式 |
|
| `shortcuts_list` | 列出可用快捷方式 |
|
||||||
| `shortcuts_execute` | 执行快捷方式 |
|
| `shortcuts_execute` | 执行快捷方式 |
|
||||||
| `switch_browser` | 切换到其他 Chrome 浏览器(仅 bridge 模式) |
|
| `update_plan` | 向你提交操作计划供审批 |
|
||||||
|
| `switch_browser` | 切换到其他 Chrome 浏览器(仅 Bridge 模式) |
|
||||||
|
|
||||||
### 外部依赖
|
## 6. 通信模式
|
||||||
|
|
||||||
| 依赖 | 用途 | 我们项目是否已有 |
|
Claude in Chrome 支持两种与浏览器通信的方式:
|
||||||
|------|------|----------------|
|
|
||||||
| `ws` | WebSocket 客户端(bridge 模式) | ✅ 有 |
|
|
||||||
| `@modelcontextprotocol/sdk` | MCP Server + 类型 | ✅ 有 |
|
|
||||||
| `fs`/`net`/`os`/`path` | Node.js 内置 | ✅ |
|
|
||||||
|
|
||||||
## 5. 修复步骤
|
### 本地 Socket(默认)
|
||||||
|
|
||||||
### 步骤 1:复制完整实现到 stub 包目录
|
Chrome 扩展通过 Native Messaging Host 与 CLI 建立 Unix socket 连接。适用于本地开发,无需额外配置。
|
||||||
|
|
||||||
```bash
|
### Bridge WebSocket
|
||||||
# 从参考项目复制 7 个文件(覆盖现有的 1 个 stub)
|
|
||||||
cp "E:/源码/claude-code-source-main/claude-code-source-main/deps/@ant/claude-for-chrome-mcp/src/"*.ts \
|
|
||||||
"E:/源码/Claude-code-bast/packages/@ant/claude-for-chrome-mcp/src/"
|
|
||||||
```
|
|
||||||
|
|
||||||
复制后 `packages/@ant/claude-for-chrome-mcp/src/` 应包含 8 个文件:
|
通过 Anthropic 的 bridge 服务中转,支持远程操控浏览器。需要 claude.ai OAuth 登录。
|
||||||
|
|
||||||
```
|
## 7. 常见问题
|
||||||
packages/@ant/claude-for-chrome-mcp/src/
|
|
||||||
├── index.ts ← 覆盖 stub(15 行,导出入口)
|
|
||||||
├── types.ts ← 新增(134 行)
|
|
||||||
├── browserTools.ts ← 新增(546 行)
|
|
||||||
├── mcpServer.ts ← 新增(96 行)
|
|
||||||
├── mcpSocketClient.ts ← 新增(493 行)
|
|
||||||
├── mcpSocketPool.ts ← 新增(327 行)
|
|
||||||
├── bridgeClient.ts ← 新增(1126 行)
|
|
||||||
└── toolCalls.ts ← 新增(301 行)
|
|
||||||
```
|
|
||||||
|
|
||||||
### 步骤 2:验证构建
|
### 扩展显示未安装
|
||||||
|
|
||||||
```bash
|
确认已从 Chrome Web Store 安装 "Claude in Chrome" 扩展,安装后重启浏览器。
|
||||||
bun run build
|
|
||||||
```
|
|
||||||
|
|
||||||
不需要改 `scripts/dev.ts` 或 `build.ts`(无 feature flag)。
|
### 工具未出现在工具列表
|
||||||
|
|
||||||
### 步骤 3:功能验证
|
检查启动时是否加了 `--chrome` 参数,或通过 `/chrome` 命令确认状态。
|
||||||
|
|
||||||
```bash
|
### 连接超时
|
||||||
# 启动(手动启用 chrome)
|
|
||||||
bun run dev -- --chrome
|
|
||||||
|
|
||||||
# 在 REPL 中:
|
确保 Chrome 浏览器正在运行且扩展已启用。Native Messaging Host 在扩展安装时自动注册,如果重装过扩展需要重启浏览器。
|
||||||
# 1. /chrome 命令应显示 Chrome 设置菜单
|
|
||||||
# 2. 如果 Chrome 扩展已安装 → 状态显示 "Enabled"
|
|
||||||
# 3. 如果未安装 → 提示安装扩展链接
|
|
||||||
```
|
|
||||||
|
|
||||||
## 6. 验证测试项
|
### 不使用 Chrome 功能时
|
||||||
|
|
||||||
### 6.1 构建验证
|
不带 `--chrome` 参数正常启动即可,不会加载任何浏览器相关模块,不影响其他功能。
|
||||||
|
|
||||||
| 测试项 | 预期结果 | 验证命令 |
|
|
||||||
|--------|---------|---------|
|
|
||||||
| build 成功 | 无报错 | `bun run build` |
|
|
||||||
| BROWSER_TOOLS 非空 | 产物中包含 17 个工具定义 | `grep "javascript_tool" dist/*.js` |
|
|
||||||
| createClaudeForChromeMcpServer 非 null | 产物中包含 MCP Server 创建逻辑 | `grep "ListToolsRequestSchema" dist/*.js` |
|
|
||||||
| Bridge WebSocket 逻辑在产物中 | 包含 bridge 连接代码 | `grep "bridge.claudeusercontent.com" dist/*.js` |
|
|
||||||
|
|
||||||
### 6.2 命令注册验证
|
|
||||||
|
|
||||||
| 测试项 | 预期结果 |
|
|
||||||
|--------|---------|
|
|
||||||
| `/chrome` 命令可见 | REPL 中输入 `/chrome` 显示设置菜单 |
|
|
||||||
| `--chrome` 参数可用 | `bun run dev -- --chrome` 不报错 |
|
|
||||||
| `--no-chrome` 参数可用 | `bun run dev -- --no-chrome` 不报错 |
|
|
||||||
|
|
||||||
### 6.3 MCP Server 验证(需要 Chrome 扩展)
|
|
||||||
|
|
||||||
| 测试项 | 预期结果 |
|
|
||||||
|--------|---------|
|
|
||||||
| Chrome 扩展检测 | 已安装扩展时 `/chrome` 显示 "Extension: Installed" |
|
|
||||||
| Socket 连接 | 扩展连接后 MCP tools 可用 |
|
|
||||||
| BROWSER_TOOLS 注册 | `tabs_context_mcp` 等 17 个工具在 MCP 工具列表中可见 |
|
|
||||||
|
|
||||||
### 6.4 工具功能验证(需要 Chrome 扩展 + 连接)
|
|
||||||
|
|
||||||
| 测试项 | 预期结果 |
|
|
||||||
|--------|---------|
|
|
||||||
| `tabs_context_mcp` | 返回当前标签组信息 |
|
|
||||||
| `navigate` | 能导航到指定 URL |
|
|
||||||
| `computer` + `screenshot` | 返回页面截图 |
|
|
||||||
| `read_page` | 返回 DOM 可访问性树 |
|
|
||||||
| `javascript_tool` | 执行 JS 并返回结果 |
|
|
||||||
|
|
||||||
### 6.5 不影响现有功能
|
|
||||||
|
|
||||||
| 测试项 | 预期结果 |
|
|
||||||
|--------|---------|
|
|
||||||
| 不带 `--chrome` 启动 | 正常运行,无 chrome 相关报错 |
|
|
||||||
| `/voice` 命令 | 不受影响 |
|
|
||||||
| `/schedule` 命令 | 不受影响 |
|
|
||||||
| `bun test` | 现有测试全部通过 |
|
|
||||||
|
|
||||||
## 7. 改动总结
|
|
||||||
|
|
||||||
| 操作 | 文件 | 说明 |
|
|
||||||
|------|------|------|
|
|
||||||
| 覆盖 stub | `packages/@ant/claude-for-chrome-mcp/src/index.ts` | 6 行 stub → 15 行完整导出 |
|
|
||||||
| 新增 | `packages/@ant/claude-for-chrome-mcp/src/types.ts` | 134 行类型定义 |
|
|
||||||
| 新增 | `packages/@ant/claude-for-chrome-mcp/src/browserTools.ts` | 546 行,17 个工具定义 |
|
|
||||||
| 新增 | `packages/@ant/claude-for-chrome-mcp/src/mcpServer.ts` | 96 行 MCP Server |
|
|
||||||
| 新增 | `packages/@ant/claude-for-chrome-mcp/src/mcpSocketClient.ts` | 493 行 Socket 客户端 |
|
|
||||||
| 新增 | `packages/@ant/claude-for-chrome-mcp/src/mcpSocketPool.ts` | 327 行连接池 |
|
|
||||||
| 新增 | `packages/@ant/claude-for-chrome-mcp/src/bridgeClient.ts` | 1126 行 Bridge 客户端 |
|
|
||||||
| 新增 | `packages/@ant/claude-for-chrome-mcp/src/toolCalls.ts` | 301 行工具调用路由 |
|
|
||||||
|
|
||||||
**不改动**:`src/` 下所有文件(已与参考项目一致)、`scripts/dev.ts`、`build.ts`。
|
|
||||||
|
|
||||||
## 8. 运行时依赖
|
|
||||||
|
|
||||||
| 依赖 | 必需? | 说明 |
|
|
||||||
|------|--------|------|
|
|
||||||
| Chrome 浏览器 | 是 | 需安装 Chrome |
|
|
||||||
| Claude in Chrome 扩展 | 是 | 从 https://claude.ai/chrome 安装 |
|
|
||||||
| claude.ai OAuth 登录 | Bridge 模式需要 | 本地 Socket 模式不需要 |
|
|
||||||
| Native Messaging Host | 本地 Socket 需要 | 扩展安装时自动注册 |
|
|
||||||
|
|
||||||
## 9. 与 /voice、/schedule 恢复方式对比
|
|
||||||
|
|
||||||
| 项 | `/schedule` | `/voice` | Claude in Chrome |
|
|
||||||
|---|---|---|---|
|
|
||||||
| 编译开关 | `AGENT_TRIGGERS_REMOTE` | `VOICE_MODE` | **无需** |
|
|
||||||
| 改 dev.ts/build.ts | ✅ | ✅ | **不需要** |
|
|
||||||
| 缺失的 vendor 二进制 | 无 | `.node` 文件 | 无 |
|
|
||||||
| 需要替换的 stub | 无 | `audio-capture-napi` | `@ant/claude-for-chrome-mcp`(7 个文件) |
|
|
||||||
| 改动 src/ 源码 | 无 | 无 | 无 |
|
|
||||||
| 平台限制 | 无 | 需原生 `.node` | 需 Chrome 浏览器 |
|
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
# Computer Use — macOS / Windows / Linux 跨平台实施计划
|
# Computer Use — macOS / Windows / Linux 跨平台实施计划
|
||||||
|
|
||||||
更新时间:2026-04-03
|
更新时间:2026-04-04
|
||||||
参考项目:`E:\源码\claude-code-source-main\claude-code-source-main`
|
参考项目:https://github.com/JrCx7scC/claude-code-source
|
||||||
|
|
||||||
## 1. 现状
|
## 1. 现状
|
||||||
|
|
||||||
@@ -11,44 +11,90 @@
|
|||||||
- ✅ `@ant/computer-use-input` 拆为 dispatcher + backends(darwin + win32)
|
- ✅ `@ant/computer-use-input` 拆为 dispatcher + backends(darwin + win32)
|
||||||
- ✅ `@ant/computer-use-swift` 拆为 dispatcher + backends(darwin + win32)
|
- ✅ `@ant/computer-use-swift` 拆为 dispatcher + backends(darwin + win32)
|
||||||
- ✅ `CHICAGO_MCP` 编译开关已开
|
- ✅ `CHICAGO_MCP` 编译开关已开
|
||||||
- ❌ `src/` 层有 6 处 macOS 硬编码阻塞
|
- ✅ `src/` 层 macOS 硬编码全部移除,已支持 darwin / win32 / linux 三平台
|
||||||
|
|
||||||
## 2. 阻塞点全景
|
## 2. 用户使用方式
|
||||||
|
|
||||||
### 2.1 入口层
|
Computer Use 由 `CHICAGO_MCP` feature flag 控制,无需额外 CLI 参数。
|
||||||
|
|
||||||
| # | 文件:行号 | 阻塞代码 | 影响 |
|
> **订阅要求**:需要 Claude Pro、Max 或 Team 订阅,Computer Use 功能不向免费用户开放。
|
||||||
|---|----------|---------|------|
|
|
||||||
| 1 | `src/main.tsx:1605` | `getPlatform() === 'macos'` | 整个 CU 初始化被跳过 |
|
|
||||||
|
|
||||||
### 2.2 加载层
|
### Dev 模式(默认已开启)
|
||||||
|
|
||||||
| # | 文件:行号 | 阻塞代码 | 影响 |
|
```bash
|
||||||
|---|----------|---------|------|
|
bun run dev
|
||||||
| 2 | `src/utils/computerUse/swiftLoader.ts:16` | `process.platform !== 'darwin'` → throw | 截图、应用管理全部不可用 |
|
```
|
||||||
| 3 | `src/utils/computerUse/executor.ts:263` | `process.platform !== 'darwin'` → throw | 整个 executor 工厂函数不可用 |
|
|
||||||
|
|
||||||
### 2.3 macOS 特有依赖
|
`scripts/dev.ts` 的默认 feature 列表已包含 `CHICAGO_MCP`,启动后自动注册 Computer Use MCP 工具。
|
||||||
|
|
||||||
| # | 文件:行号 | 依赖 | macOS 实现 | 需要替代方案 |
|
### 构建产物
|
||||||
|---|----------|------|-----------|------------|
|
|
||||||
| 4 | `executor.ts:70-88` | 剪贴板 | `pbcopy`/`pbpaste` | Win: PowerShell `Get/Set-Clipboard`;Linux: `xclip`/`wl-copy` |
|
|
||||||
| 5 | `drainRunLoop.ts:21` | CFRunLoop pump | `cu._drainMainRunLoop()` | 非 darwin:直接执行 fn(),不需要 pump |
|
|
||||||
| 6 | `escHotkey.ts:28` | ESC 热键 | CGEventTap | 非 darwin:返回 false(已有 Ctrl+C fallback) |
|
|
||||||
| 7 | `hostAdapter.ts:48-54` | 系统权限 | TCC accessibility + screenRecording | Win:直接 granted;Linux:检查 xdotool |
|
|
||||||
| 8 | `common.ts:56` | 平台标识 | `platform: 'darwin'` 硬编码 | 动态获取 |
|
|
||||||
| 9 | `executor.ts:180` | 粘贴快捷键 | `command+v` | Win/Linux:`ctrl+v` |
|
|
||||||
|
|
||||||
### 2.4 缺失的 Linux 后端
|
```bash
|
||||||
|
FEATURE_CHICAGO_MCP=1 node dist/cli.js
|
||||||
|
```
|
||||||
|
|
||||||
| 包 | macOS | Windows | Linux |
|
### 使用流程
|
||||||
|---|-------|---------|-------|
|
|
||||||
| `computer-use-input/backends/` | ✅ darwin.ts | ✅ win32.ts | ❌ 需新建 linux.ts |
|
|
||||||
| `computer-use-swift/backends/` | ✅ darwin.ts | ✅ win32.ts | ❌ 需新建 linux.ts |
|
|
||||||
|
|
||||||
## 3. 每个平台的能力依赖
|
1. **启动 CLI** — `bun run dev`(或构建产物 + 环境变量)
|
||||||
|
2. **正常对话** — 在 REPL 中与 Claude 对话,当你让 Claude 操作电脑时(如"帮我打开浏览器并访问 xxx"),Claude 会调用 Computer Use 工具
|
||||||
|
3. **首次审批** — Claude 首次尝试操控某个 App 时,会弹出权限对话框,你需要确认允许哪些 App 被操控(可勾选"本次会话不再询问")
|
||||||
|
4. **操作中** — 系统会发送通知"Claude is using your computer",macOS 按 Esc、其他平台按 Ctrl+C 可中止
|
||||||
|
5. **操作结束** — Claude 完成操作后自动释放,被隐藏的窗口会自动恢复
|
||||||
|
|
||||||
### 3.1 computer-use-input(键鼠)
|
### 可用的操作
|
||||||
|
|
||||||
|
- 截图(全屏 / 区域缩放)
|
||||||
|
- 鼠标移动、点击、拖拽、滚轮
|
||||||
|
- 键盘输入、组合键、长按
|
||||||
|
- 通过剪贴板粘贴多行文本
|
||||||
|
- 应用管理(列出、打开、隐藏/恢复)
|
||||||
|
- 多显示器支持(自动选择或手动指定)
|
||||||
|
|
||||||
|
### Linux 依赖工具
|
||||||
|
|
||||||
|
| 工具 | 用途 | 安装命令(Ubuntu) |
|
||||||
|
|------|------|-------------------|
|
||||||
|
| `xdotool` | 键鼠模拟 + 窗口管理 | `sudo apt install xdotool` |
|
||||||
|
| `scrot` 或 `gnome-screenshot` | 截图 | `sudo apt install scrot` |
|
||||||
|
| `xrandr` | 显示器信息 | 通常已预装 |
|
||||||
|
| `xclip` | 剪贴板 | `sudo apt install xclip` |
|
||||||
|
| `wmctrl` | 窗口列表/切换 | `sudo apt install wmctrl` |
|
||||||
|
|
||||||
|
Wayland 环境需要替代工具:`ydotool`(替代 xdotool)、`grim`(替代 scrot)、`wl-clipboard`(替代 xclip)。初期只支持 X11,Wayland 标记为 todo。
|
||||||
|
|
||||||
|
### macOS 权限
|
||||||
|
|
||||||
|
macOS 首次使用需要授予「辅助功能」和「屏幕录制」权限(系统会提示)。
|
||||||
|
|
||||||
|
### Windows
|
||||||
|
|
||||||
|
无需额外权限,开箱即用。
|
||||||
|
|
||||||
|
## 3. 实施细节
|
||||||
|
|
||||||
|
### 3.1 功能开关(gates.ts)
|
||||||
|
|
||||||
|
- `enabled` 默认为 `true`,无需订阅检查
|
||||||
|
- `hasRequiredSubscription()` 直接返回 `true`
|
||||||
|
- 子开关(鼠标动画、隐藏窗口、剪贴板守卫等)均通过 GrowthBook 远程配置或使用默认值
|
||||||
|
|
||||||
|
### 3.2 平台分发
|
||||||
|
|
||||||
|
所有平台相关逻辑已通过 `process.platform` 判断分发:
|
||||||
|
|
||||||
|
| 文件 | 处理方式 |
|
||||||
|
|------|---------|
|
||||||
|
| `executor.ts` | 剪贴板:darwin→pbcopy/pbpaste,win32→PowerShell,linux→xclip;粘贴键:darwin→command+v,其他→ctrl+v |
|
||||||
|
| `drainRunLoop.ts` | 非 darwin 直接执行 fn(),不需要 CFRunLoop pump |
|
||||||
|
| `escHotkey.ts` | 非 darwin 返回 false(已有 Ctrl+C fallback) |
|
||||||
|
| `hostAdapter.ts` | 非 darwin 直接返回 `{ granted: true }`,macOS 检查 TCC 权限 |
|
||||||
|
| `common.ts` | 动态获取 platform 标识,截图过滤按平台选择 |
|
||||||
|
| `swiftLoader.ts` | 自动检测包导出类型,跨平台实例化 `ComputerUseAPI` |
|
||||||
|
| `main.tsx` | 仅检查 `feature('CHICAGO_MCP')` + 交互模式,无平台限制 |
|
||||||
|
|
||||||
|
### 3.3 每个平台的能力依赖
|
||||||
|
|
||||||
|
#### computer-use-input(键鼠)
|
||||||
|
|
||||||
| 功能 | macOS | Windows | Linux |
|
| 功能 | macOS | Windows | Linux |
|
||||||
|------|-------|---------|-------|
|
|------|-------|---------|-------|
|
||||||
@@ -61,7 +107,7 @@
|
|||||||
| 前台应用 | System Events osascript | GetForegroundWindow P/Invoke | xdotool getactivewindow + /proc |
|
| 前台应用 | System Events osascript | GetForegroundWindow P/Invoke | xdotool getactivewindow + /proc |
|
||||||
| 工具依赖 | osascript(内置) | powershell(内置) | xdotool(需安装) |
|
| 工具依赖 | osascript(内置) | powershell(内置) | xdotool(需安装) |
|
||||||
|
|
||||||
### 3.2 computer-use-swift(截图 + 应用管理)
|
#### computer-use-swift(截图 + 应用管理)
|
||||||
|
|
||||||
| 功能 | macOS | Windows | Linux |
|
| 功能 | macOS | Windows | Linux |
|
||||||
|------|-------|---------|-------|
|
|------|-------|---------|-------|
|
||||||
@@ -73,7 +119,7 @@
|
|||||||
| 隐藏/显示 | System Events visibility | ShowWindow/SetForegroundWindow | wmctrl -c / xdotool |
|
| 隐藏/显示 | System Events visibility | ShowWindow/SetForegroundWindow | wmctrl -c / xdotool |
|
||||||
| 工具依赖 | screencapture + osascript | powershell | xdotool + scrot/grim + wmctrl |
|
| 工具依赖 | screencapture + osascript | powershell | xdotool + scrot/grim + wmctrl |
|
||||||
|
|
||||||
### 3.3 executor 层
|
#### executor 层
|
||||||
|
|
||||||
| 功能 | macOS | Windows | Linux |
|
| 功能 | macOS | Windows | Linux |
|
||||||
|------|-------|---------|-------|
|
|------|-------|---------|-------|
|
||||||
@@ -85,113 +131,12 @@
|
|||||||
| 终端检测 | __CFBundleIdentifier | WT_SESSION / TERM_PROGRAM | TERM_PROGRAM |
|
| 终端检测 | __CFBundleIdentifier | WT_SESSION / TERM_PROGRAM | TERM_PROGRAM |
|
||||||
| 系统权限 | TCC check | 直接 granted | 检查 xdotool 安装 |
|
| 系统权限 | TCC check | 直接 granted | 检查 xdotool 安装 |
|
||||||
|
|
||||||
## 4. 执行步骤
|
## 4. 完成状态
|
||||||
|
|
||||||
### Phase 1:已完成 ✅
|
| Phase | 内容 | 状态 |
|
||||||
|
|-------|------|------|
|
||||||
|
| Phase 1 | MCP 实现 + Windows 后端 | ✅ 已完成 |
|
||||||
|
| Phase 2 | 移除 macOS 硬编码 | ✅ 已完成 |
|
||||||
|
| Phase 3 | Linux 后端(待新建 linux.ts) | ❌ 未完成 |
|
||||||
|
|
||||||
- [x] `@ant/computer-use-mcp` stub → 完整实现
|
Phase 1-2 完成后 macOS + Windows 可用。Phase 3(Linux 后端)需要新建 `packages/@ant/computer-use-input/src/backends/linux.ts`(~150 行)和 `packages/@ant/computer-use-swift/src/backends/linux.ts`(~200 行),并在对应 dispatcher 中加 `case 'linux'`。
|
||||||
- [x] `@ant/computer-use-input` dispatcher + darwin/win32 backends
|
|
||||||
- [x] `@ant/computer-use-swift` dispatcher + darwin/win32 backends
|
|
||||||
- [x] `CHICAGO_MCP` 编译开关
|
|
||||||
|
|
||||||
### Phase 2:移除 6 处 macOS 硬编码(解锁 macOS + Windows)
|
|
||||||
|
|
||||||
**改动原则:macOS 代码路径不变,只在每处 darwin 守卫后加 win32/linux 分支。**
|
|
||||||
|
|
||||||
| 步骤 | 文件 | 改动 |
|
|
||||||
|------|------|------|
|
|
||||||
| 2.1 | `src/main.tsx:1605` | `getPlatform() === 'macos'` → 去掉平台限制,或改为 `!== 'unknown'` |
|
|
||||||
| 2.2 | `src/utils/computerUse/swiftLoader.ts:16-18` | 移除 `process.platform !== 'darwin'` throw。`@ant/computer-use-swift/index.ts` 已有跨平台 dispatch |
|
|
||||||
| 2.3 | `src/utils/computerUse/executor.ts:263-267` | 移除 `process.platform !== 'darwin'` throw。改为检查 input/swift isSupported |
|
|
||||||
| 2.4 | `src/utils/computerUse/executor.ts:70-88` | 剪贴板函数按平台分发:darwin→pbcopy/pbpaste,win32→PowerShell Get/Set-Clipboard,linux→xclip |
|
|
||||||
| 2.5 | `src/utils/computerUse/executor.ts:180` | `typeViaClipboard` 中 `command+v` → 非 darwin 时用 `ctrl+v` |
|
|
||||||
| 2.6 | `src/utils/computerUse/executor.ts:273` | `const cu = requireComputerUseSwift()` → 改为 `new ComputerUseAPI()`(从 package 直接实例化,不走 swiftLoader throw) |
|
|
||||||
| 2.7 | `src/utils/computerUse/drainRunLoop.ts` | 开头加 `if (process.platform !== 'darwin') return fn()` |
|
|
||||||
| 2.8 | `src/utils/computerUse/escHotkey.ts` | `registerEscHotkey` 非 darwin 返回 false(已有 Ctrl+C fallback) |
|
|
||||||
| 2.9 | `src/utils/computerUse/hostAdapter.ts:48-54` | `ensureOsPermissions` 非 darwin 返回 `{ granted: true }` |
|
|
||||||
| 2.10 | `src/utils/computerUse/common.ts:56` | `platform: 'darwin'` → `platform: process.platform === 'win32' ? 'windows' : process.platform === 'linux' ? 'linux' : 'darwin'` |
|
|
||||||
| 2.11 | `src/utils/computerUse/common.ts:55` | `screenshotFiltering: 'native'` → 非 darwin 时 `'none'`(Windows/Linux 截图不支持 per-app 过滤) |
|
|
||||||
| 2.12 | `src/utils/computerUse/gates.ts:13` | `enabled: false` → `enabled: true`(无 GrowthBook 时默认可用) |
|
|
||||||
| 2.13 | `src/utils/computerUse/gates.ts:39-43` | `hasRequiredSubscription()` → 直接返回 `true` |
|
|
||||||
|
|
||||||
### Phase 3:新增 Linux 后端
|
|
||||||
|
|
||||||
| 步骤 | 文件 | 内容 |
|
|
||||||
|------|------|------|
|
|
||||||
| 3.1 | `packages/@ant/computer-use-input/src/backends/linux.ts` | xdotool 键鼠(mousemove/click/key/type/getactivewindow) |
|
|
||||||
| 3.2 | `packages/@ant/computer-use-swift/src/backends/linux.ts` | scrot/grim 截图 + xrandr 显示器 + wmctrl 窗口管理 |
|
|
||||||
| 3.3 | `packages/@ant/computer-use-input/src/index.ts` | dispatcher 加 `case 'linux'` |
|
|
||||||
| 3.4 | `packages/@ant/computer-use-swift/src/index.ts` | dispatcher 加 `case 'linux'` |
|
|
||||||
|
|
||||||
### Phase 4:验证
|
|
||||||
|
|
||||||
| 测试项 | macOS | Windows | Linux |
|
|
||||||
|--------|-------|---------|-------|
|
|
||||||
| build 成功 | ✅ | 验证 | 验证 |
|
|
||||||
| MCP 工具列表非空 | 验证 | 验证 | 验证 |
|
|
||||||
| 鼠标移动 | 验证 | ✅ 已通过 | 验证 |
|
|
||||||
| 截图 | 验证 | ✅ 已通过 | 验证 |
|
|
||||||
| 键盘输入 | 验证 | 验证 | 验证 |
|
|
||||||
| 前台窗口 | 验证 | ✅ 已通过 | 验证 |
|
|
||||||
| 剪贴板 | 验证 | 验证 | 验证 |
|
|
||||||
|
|
||||||
## 5. 文件改动总览
|
|
||||||
|
|
||||||
### 不动的文件(14 个)
|
|
||||||
|
|
||||||
`cleanup.ts`、`computerUseLock.ts`、`wrapper.tsx`、`toolRendering.tsx`、`mcpServer.ts`、`setup.ts`、`appNames.ts`、`inputLoader.ts`、`src/services/mcp/client.ts`、`@ant/computer-use-mcp/src/*`(Phase 1 已完成)、`backends/darwin.ts`(两个包都不动)
|
|
||||||
|
|
||||||
### 改 src/ 的文件(8 个)
|
|
||||||
|
|
||||||
| 文件 | 改动量 | 风险 |
|
|
||||||
|------|--------|------|
|
|
||||||
| `main.tsx` | 1 行 | 低 |
|
|
||||||
| `swiftLoader.ts` | 2 行 | 低 |
|
|
||||||
| `executor.ts` | ~40 行(剪贴板分发 + 平台守卫 + paste 快捷键) | **中** |
|
|
||||||
| `drainRunLoop.ts` | 1 行 | 低 |
|
|
||||||
| `escHotkey.ts` | 3 行 | 低 |
|
|
||||||
| `hostAdapter.ts` | 5 行 | 低 |
|
|
||||||
| `common.ts` | 3 行 | 低 |
|
|
||||||
| `gates.ts` | 3 行 | 低 |
|
|
||||||
|
|
||||||
### 新增文件(2 个)
|
|
||||||
|
|
||||||
| 文件 | 行数估算 |
|
|
||||||
|------|---------|
|
|
||||||
| `packages/@ant/computer-use-input/src/backends/linux.ts` | ~150 行 |
|
|
||||||
| `packages/@ant/computer-use-swift/src/backends/linux.ts` | ~200 行 |
|
|
||||||
|
|
||||||
## 6. Linux 依赖工具
|
|
||||||
|
|
||||||
| 工具 | 用途 | 安装命令(Ubuntu) |
|
|
||||||
|------|------|-------------------|
|
|
||||||
| `xdotool` | 键鼠模拟 + 窗口管理 | `sudo apt install xdotool` |
|
|
||||||
| `scrot` 或 `gnome-screenshot` | 截图 | `sudo apt install scrot` |
|
|
||||||
| `xrandr` | 显示器信息 | 通常已预装 |
|
|
||||||
| `xclip` | 剪贴板 | `sudo apt install xclip` |
|
|
||||||
| `wmctrl` | 窗口列表/切换 | `sudo apt install wmctrl` |
|
|
||||||
|
|
||||||
Wayland 环境需要替代工具:`ydotool`(替代 xdotool)、`grim`(替代 scrot)、`wl-clipboard`(替代 xclip)。初期可先只支持 X11,Wayland 标记为 todo。
|
|
||||||
|
|
||||||
## 7. 执行顺序建议
|
|
||||||
|
|
||||||
```
|
|
||||||
Phase 2(解锁 macOS + Windows)
|
|
||||||
├── 2.1-2.3 移除 3 处硬编码 throw/skip
|
|
||||||
├── 2.4-2.5 剪贴板 + 粘贴快捷键平台分发
|
|
||||||
├── 2.6 swiftLoader → 直接实例化
|
|
||||||
├── 2.7-2.9 drainRunLoop / escHotkey / permissions 平台分支
|
|
||||||
├── 2.10-2.11 common.ts 平台标识动态化
|
|
||||||
├── 2.12-2.13 gates.ts 默认值
|
|
||||||
└── 验证 Windows
|
|
||||||
|
|
||||||
Phase 3(Linux 后端)
|
|
||||||
├── 3.1 input/backends/linux.ts
|
|
||||||
├── 3.2 swift/backends/linux.ts
|
|
||||||
├── 3.3-3.4 dispatcher 加 linux case
|
|
||||||
└── 验证 Linux
|
|
||||||
|
|
||||||
Phase 4(集成验证 + PR)
|
|
||||||
```
|
|
||||||
|
|
||||||
每个 Phase 可独立验证、独立提交。Phase 2 完成后 macOS + Windows 可用,Phase 3 完成后三平台全部可用。
|
|
||||||
|
|||||||
Reference in New Issue
Block a user