Claude Code 通过「Claude in Chrome」浏览器扩展获得浏览器自动化能力，让你在 CLI 中直接控制浏览器，构建代码后立即在浏览器中测试和调试，无需切换上下文。
核心能力
Chrome 集成后，可以将浏览器操作与编码任务串联在单个工作流中：
| 能力 | 说明 |
|---|---|
| 实时调试 | 直接读取控制台错误和 DOM 状态，然后修复引发问题的代码 |
| 设计验证 | 从 Figma 稿构建 UI，在浏览器中验证是否与设计稿吻合 |
| Web 应用测试 | 测试表单验证、检查视觉回归、验证用户流程 |
| 已认证 Web 应用 | 与 Google Docs、Gmail、Notion 等已登录应用交互，无需 API 连接器 |
| 数据提取 | 从网页提取结构化信息并本地保存 |
| 任务自动化 | 自动化数据录入、表单填写、多站点工作流等重复性操作 |
| 会话录制 | 将浏览器操作录制为 GIF，用于记录或分享 |
Claude 会在可见的 Chrome 窗口中实时执行浏览器操作。遇到登录页面或 CAPTCHA 时，Claude 会暂停并请你手动处理。
前置要求
- 浏览器：Google Chrome 或 Microsoft Edge（不支持 Brave、Arc 等其他基于 Chromium 的浏览器；不支持 WSL）
- 扩展：Claude in Chrome 扩展 v1.0.36 或更高版本
- Claude Code：v2.0.73 或更高版本
- 订阅：直接 Anthropic 计划（Pro、Max、Teams 或 Enterprise）
⚠️ Chrome 集成不支持通过 Amazon Bedrock、Google Cloud Vertex AI 或 Microsoft Foundry 访问 Claude 的用户。如果你只通过第三方提供商访问，需要单独的 claude.ai 账号才能使用此功能。
快速上手
启用 Chrome 集成
# 方式一：启动时带 --chrome flag
claude --chrome
# 方式二：在现有会话中启用
/chrome设为默认启用
/chrome → 选择「Enabled by default」
注意：默认启用 Chrome 会增加 Context 用量（浏览器工具始终加载）。如果发现 Context 消耗明显增加，建议关闭默认启用，只在需要时带
--chrome启动。
管理站点权限
站点级权限继承自 Chrome 扩展设置。在扩展设置中管理哪些站点 Claude 可以浏览、点击和输入。
查看所有可用浏览器工具
/mcp → 选择 claude-in-chrome
实战工作流示例
1. 测试本地 Web 应用
> I just updated the login form validation.
> Open localhost:3000, try submitting the form with invalid data,
> and check if the error messages appear correctly.
Claude 导航到本地服务器，与表单交互，报告观察结果。
2. 读取控制台日志调试
> Open the dashboard page and check the console for any errors
> when the page loads.
Claude 读取控制台消息，可以筛选特定模式或错误类型。
建议告诉 Claude 要找什么模式，而不是请求所有控制台输出（日志可能很冗长）。
3. 自动化表单填写
> I have a spreadsheet of customer contacts in contacts.csv.
> For each row, go to crm.example.com, click "Add Contact",
> and fill in the name, email, and phone fields.
Claude 读取本地文件，导航 Web 界面，逐行录入数据。
4. 在 Google Docs 中起草内容
> Open my project brief at docs.google.com/document/d/xxx
> and add a new section called "Implementation Plan"
> based on the outline in @project-outline.md
无需 Google API，Claude 直接在你已登录的 Docs 中写入。
5. 从网页提取数据
> Go to the pricing page at competitor.com/pricing
> and extract all plan names, prices, and features into
> a structured JSON file at ./research/competitor-pricing.json
6. 多站点工作流
> Check our GitHub Issues for bugs labeled 'critical',
> then search our internal Jira for related tickets,
> and create a consolidated report in reports/critical-bugs.md
7. 录制操作 GIF
> Record a GIF of me signing up on localhost:3000,
> filling out the form and completing registration.
> Save it as demo/signup-flow.gif
与 VS Code 集成
VS Code 扩展中也支持 Chrome 集成，安装了 Chrome 扩展后无需额外 Flag，参见 VS Code 浏览器自动化文档。
故障排查
| 问题 | 解决方案 |
|---|---|
| 扩展未被检测到 | 确认 Chrome 扩展已启用，运行 /chrome 查看连接状态 |
| 浏览器无响应 | 关闭其他 Chrome 标签页/扩展减少干扰，重启 Chrome 后重试 |
| 长会话中连接断开 | 运行 /chrome 重新连接；避免让浏览器长时间空闲 |
| Windows 特定问题 | 确保使用原生 Windows Chrome/Edge，不要在 WSL 内运行 |
常见错误信息：
Extension not found：重新安装扩展，确保版本 ≥ 1.0.36Connection refused：确保 Claude Code 版本 ≥ 2.0.73Permission denied for site：在扩展设置中允许目标域名
原文：Use Claude Code with Chrome (beta) | 来源：Anthropic 官方文档