ClaudeChrome：让AI真正”看见”你的浏览器——原生扩展+Agent的下一跳

你有没有遇到过这种情况——让 AI 帮你处理一个网页相关的工作，它能写代码、能分析截图，但就是”看不见”你正在用的那个真实页面？每次都要手动把页面内容复制粘贴给它，信息损失不说，效率也卡在半路上。

ClaudeChrome 就是来解决这个问题的。

这是一个 Chrome 原生扩展，目标非常纯粹——把 Agent 智能真正带进浏览器里。它目前支持 Claude、Codex 和 Shell 三种 Agent，运行在你的真实 Chrome 里，绑定到真实的页面标签页上。

它能做什么？

核心能力有这几个：

• 页面上下文感知：Agent 不再只靠截图和 prompt 猜页面内容，而是直接读取 DOM、获取页面文本、拿到当前 URL 和标签页信息。
• 执行 JavaScript：让 Agent 直接在真实页面上跑 JS，完成抓取、注入、交互验证等操作。
• Console 抓取：读取浏览器控制台日志，方便 Agent 分析运行时错误。
• 多标签页协作：后续版本规划了标签页协作支持。
• 工作区隔离：每个会话有独立的工作目录，不会把你整个项目目录暴露给 Agent。

简单说，ClaudeChrome 把”浏览器”变成了 Agent 的”眼睛和手”。

适合谁用？

• 前端开发者：让 Agent 帮你分析页面元素、调试 UI 问题、验证样式修复。
• 爬虫/数据采集：Agent 可以直接抓取动态渲染页面，比纯请求头渲染更稳。
• AI 研究者：测试 Agent 在真实网页环境里的行为，不用再靠 mock 数据。
• 自动化测试：用自然语言描述测试步骤，Agent 执行 Playwright 一类的浏览器操作。

怎么安装？

项目提供了完整的预编译包，不需要从源码构建：

• 下载 ClaudeChrome-extension-v0.1.2.zip（Chrome 扩展）
• 下载 ClaudeChrome-native-host-v0.1.2.zip（本地 Node.js host）
• 解压后在 chrome://extensions 里 Load unpacked 扩展
• 运行 native host 启动脚本（macOS/Linux/Windows 都有对应版本）
• 打开侧边栏，确认连接状态变成 Connected
• 新建 Claude 或 Codex pane，绑定到目标标签页，开用

官方文档写得很清楚，Windows/macOS/Linux 全平台覆盖。

我的感受

这类工具之前有个痛点：Agent 做网页相关任务时，要么靠截图”盲猜”，要么靠手动复制粘贴把上下文喂给它——两者都有严重的信息损失。ClaudeChrome 从架构上改变了这个局面，让 Agent 和真实浏览器共享上下文。

技术细节也值得提一下：Claude pane 通过 claudechrome-browser MCP 工具暴露浏览器能力，而不是简单地把整个页面上下文塞进 prompt——这种设计对 Token 消耗也更友好。

项目目前是 v0.1.2，Roadmap 里有 v0.2.0 的多标签页支持和样式修改接口，值得保持关注。

GitHub：https://github.com/NatsuFox/ClaudeChrome

GitHub: https://github.com/NatsuFox/ClaudeChrome