Coding Agent 浏览器与桌面操作
Coding agent 的浏览器和 Computer Use 能力让 AI 看到并操作真实 UI，适合 Web App 调试、GUI 复现、截图定位问题等静态读代码无法完成的任务。
#tech / ai
#type / concept
#status / growing
[!info] related notes
- 所属 MOC: Coding Agent MOC
- 前置概念: Agent-Computer Interface (ACI)
- 关系笔记: Autonomous Coding Agent
Coding Agent 浏览器与桌面操作
一句话定义
浏览器和 Computer Use 是 coding agent 操作真实 UI 的能力——浏览器模式让 AI 打开网页、点击、检查 DOM、看控制台；Computer Use 更进一步，能操作桌面应用的图形界面。核心价值是让 agent 接近真实用户路径，而不是只读静态代码。
为什么需要
很多 bug 不是静态读代码能完全判断的：
- 前端列表不更新，需要真实点击看 Network 请求
- CSS 布局问题，需要截图看渲染结果
- 只在 GUI 出现的 bug，需要操作桌面应用复现
- SSE 事件流问题，需要在浏览器里观察实时行为
两种能力层级
浏览器模式（In-app Browser / Chrome）
| 能力 | 作用 |
|---|---|
| 打开网页 | 导航到指定 URL |
| 点击/输入 | 模拟用户交互 |
| 检查 DOM | 查看页面结构 |
| 读 console | 获取错误日志 |
| 看 Network | 观察请求和响应 |
| 截图 | 捕获页面状态 |
| 运行 JS | 执行只读页面检查 |
Computer Use（桌面 GUI 操作）
| 能力 | 作用 |
|---|---|
| 打开应用 | 启动桌面 app |
| 点击/输入 | 操作 GUI 元素 |
| 看屏幕 | 识别屏幕内容 |
| 调整窗口 | 改变窗口大小、位置 |
| 复现 bug | 在真实 GUI 中重现问题 |
各产品的实现
Codex
- In-app browser：内置浏览器，和 Codex 共享渲染后的网页视图
- 支持本地开发服务器、文件预览、公开页面
- 可以点击、输入、检查页面状态、截图、下载页面资源
- Browser use：更强的浏览器操作能力
- Computer Use：macOS 和 Windows，能操作图形界面
- Appshots：把当前前台 App 窗口截图和可用文本发给 Codex
Claude Code
- Chrome 集成：
claude --chrome或/chrome连接 Chrome/Edge - 使用浏览器里的登录状态
- 遇到登录页或 CAPTCHA 会暂停让你手动处理
- Computer Use：CLI 版 macOS research preview，Desktop 版支持 macOS 和 Windows
- 每个 app 单独批准、敏感 app 警告、Esc 全局停止
适合场景
| 场景 | 用法 |
|---|---|
| 前端 bug 复现 | 打开页面，点击操作，观察行为 |
| UI 布局检查 | 截图对比设计稿 |
| SSE 事件流调试 | 在浏览器里观察实时事件 |
| 桌面 app bug | Computer Use 操作 GUI 复现 |
| 无 API 的工具 | 用鼠标键盘操作 |
安全注意
- Computer Use 操作你的真实桌面，不是沙箱
- 会移动鼠标、输入文字、影响前台应用
- 给它窄范围任务，仔细审查权限提示
- Esc 可全局停止
最短记忆方式
浏览器模式让 AI 看到并操作网页；Computer Use 让 AI 操作桌面 GUI。核心价值是接近真实用户路径调试问题。