Appearance
在 Chrome 中使用 Claude Code（Beta）
Claude Code 通过 Claude in Chrome 浏览器扩展获得浏览器自动化能力：构建代码后直接在浏览器测试和调试，无需切换上下文。Claude 打开新标签页执行任务，共享你的登录状态，可操作 Google Docs、Gmail 等任何已登录的应用。遇到登录页或 CAPTCHA 时自动暂停等待手动处理。支持 Google Chrome 和 Microsoft Edge，需要 claude.ai 直接订阅（Pro/Max/Team/Enterprise）。
Claude Code 通过 Claude in Chrome 浏览器扩展获得浏览器自动化能力，让你在 CLI 或 VS Code 扩展中直接控制浏览器，构建代码后无需切换上下文即可测试调试。
如果你搜索的是“Claude Code 能不能自动打开浏览器做功能测试”，答案是：可以，但它更适合人工辅助式验证，而不是替代完整的 Playwright 测试套件。适合让 Claude 打开本地页面、点击按钮、看控制台报错、截图确认 UI；不适合绕过登录风控、CAPTCHA 或长时间无人值守操作。
什么时候用 Chrome 集成
| 场景 | 推荐程度 | 怎么用 |
|---|---|---|
| 本地 Web 应用冒烟测试 | 推荐 | 让 Claude 打开 localhost，按用户路径点击一遍 |
| 调试控制台报错 | 推荐 | 指定页面和错误现象，让 Claude 读取 console 和 DOM |
| 验证 UI 样式是否明显错位 | 推荐 | 让 Claude 截图观察，但关键视觉验收仍建议人工复核 |
| 生成稳定回归测试 | 不够 | 用 Chrome 先探索路径，再沉淀成 Playwright 测试 |
| 绕过验证码、风控或网站限制 | 不适合 | 遇到登录页或 CAPTCHA 应手动处理 |
能做什么
| 功能 | 说明 |
|---|---|
| 实时调试 | 直接读取控制台错误和 DOM 状态，修复导致问题的代码 |
| 设计验证 | 根据 Figma 稿构建 UI，在浏览器里验证还原度 |
| Web 应用测试 | 测试表单验证、检查视觉回归、验证用户流程 |
| 已认证应用 | 操作 Google Docs、Gmail、Notion 等你已登录的应用（无需 API 连接器） |
| 数据提取 | 从网页提取结构化信息保存到本地 |
| 任务自动化 | 数据录入、表单填写、跨站工作流自动化 |
| 录制 GIF | 录制浏览器交互过程生成 GIF，方便分享演示 |
Claude 打开新标签页来执行浏览器任务，共享你浏览器的登录状态。遇到登录页或 CAPTCHA 时，Claude 会暂停并请你手动处理。
前提条件
- Google Chrome 或 Microsoft Edge
- Claude in Chrome 扩展 v1.0.36+（Chrome Web Store 两款浏览器均可安装）
- Claude Code v2.0.73+
- claude.ai 直接订阅（Pro、Max、Team 或 Enterprise）
开始使用（CLI）
第一步：启动时开启 Chrome 集成：
bash
claude --chrome第二步：在会话中让 Claude 使用浏览器：
text
前往 code.claude.com/docs，点击搜索框，输入 "hooks"，告诉我出现了哪些结果随时运行 /chrome 检查连接状态、管理权限或重新连接扩展。VS Code 版见浏览器自动化，无需额外标志。
设为默认开启
避免每次都传 --chrome 参数：运行 /chrome，选择"Enabled by default"。
VS Code 扩展中，只要安装了 Chrome 扩展，Chrome 功能就始终可用，无需额外标志。
管理站点权限
站点级权限继承自 Chrome 扩展。在 Chrome 扩展设置中管理权限，控制 Claude 可以浏览、点击和输入的站点。
实用场景示例
运行 /mcp 选择 claude-in-chrome 可查看所有可用浏览器工具。
测试本地 Web 应用
text
我刚更新了登录表单验证。你能打开 localhost:3000，尝试提交无效数据，
检查错误提示是否正确显示吗？更稳的说法是把路径、账号状态和验收点都讲清楚：
text
请打开 http://localhost:3000/login，用空邮箱提交一次，再输入错误格式邮箱提交一次。
只检查错误提示、按钮禁用状态和控制台报错；不要改代码，先告诉我你看到什么。用控制台日志调试
告诉 Claude 要找什么模式，而不是要求获取所有控制台输出（日志可能很多）：
text
打开 dashboard 页面，检查页面加载时控制台里有什么错误自动填写表单
text
我有个客户联系人列表存在 contacts.csv 里。对每一行，
去 crm.example.com 点击"添加联系人"，填写姓名、邮箱和电话。在 Google Docs 里起草内容
text
根据最近的 commits，起草一份项目更新报告，添加到我的 Google Doc
docs.google.com/document/d/abc123提取网页数据
text
去产品列表页，提取每个商品的名称、价格和库存状态，保存为 CSV 文件跨站工作流
text
查看我明天的日历，对每个有外部参与者的会议，查找他们的公司网站，
添加一条关于他们业务的备注录制演示 GIF
text
录制一个 GIF，展示从把商品加入购物车到确认页面的完整结帷流程故障排查
未检测到扩展
如果 Claude Code 显示"Chrome extension not detected"：
- 在
chrome://extensions确认扩展已安装并启用 - 运行
claude --version确认版本 - 确认 Chrome 正在运行
- 运行
/chrome选择"Reconnect extension" - 问题持续则重启 Claude Code 和 Chrome
首次启用注意：Claude Code 会安装 Native Messaging Host 配置文件，Chrome 在启动时读取此文件。首次检测失败请重启 Chrome。
验证配置文件是否存在：
Chrome：
- macOS：
~/Library/Application Support/Google/Chrome/NativeMessagingHosts/com.anthropic.claude_code_browser_extension.json - Linux：
~/.config/google-chrome/NativeMessagingHosts/com.anthropic.claude_code_browser_extension.json - Windows：注册表
HKCU\Software\Google\Chrome\NativeMessagingHosts\
Edge：
- macOS：
~/Library/Application Support/Microsoft Edge/NativeMessagingHosts/com.anthropic.claude_code_browser_extension.json - Linux：
~/.config/microsoft-edge/NativeMessagingHosts/com.anthropic.claude_code_browser_extension.json - Windows：注册表
HKCU\Software\Microsoft\Edge\NativeMessagingHosts\
浏览器不响应
- 检查页面是否有 JavaScript 对话框（alert/confirm/prompt）阻塞——手动关闭后告诉 Claude 继续
- 让 Claude 新建标签页重试
- 在
chrome://extensions禁用后重新启用扩展
长时间会话连接断开
Chrome 扩展的 service worker 可能在长时间不活动后进入休眠。运行 /chrome 选择"Reconnect extension"重新连接。
Windows 特有问题
- 命名管道冲突（EADDRINUSE）：重启 Claude Code，关闭其他正在使用 Chrome 的 Claude Code 会话
- Native Messaging Host 崩溃：重新安装 Claude Code 以重新生成主机配置
常见错误信息
| 错误 | 原因 | 解决方法 |
|---|---|---|
| "Browser extension is not connected" | Native Messaging Host 无法连接扩展 | 重启 Chrome 和 Claude Code，运行 /chrome 重连 |
| "Extension not detected" | 扩展未安装或已禁用 | 在 chrome://extensions 安装或启用 |
| "No tab available" | Claude 在标签页准备好前就尝试操作 | 让 Claude 新建标签页重试 |
| "Receiving end does not exist" | 扩展 service worker 进入休眠 | 运行 /chrome 选择"Reconnect extension" |
相关文档
- Computer use — 控制原生 macOS 应用（浏览器无法完成的任务）
- VS Code Chrome 自动化 — VS Code 扩展中的浏览器自动化
- CLI 参考 — 包含
--chrome等命令行标志 - 数据与隐私 — Claude Code 如何处理数据
- Claude in Chrome 入门指南 — Chrome 扩展完整文档（快捷键、计划任务、权限）
常见问题
Q: Chrome 集成支持哪些浏览器？
目前支持 Google Chrome 和 Microsoft Edge（均使用 Chrome Web Store 安装扩展）。暂不支持 Brave、Arc 或其他 Chromium 浏览器，也不支持 WSL（Windows Subsystem for Linux）。
Q: Claude 可以访问我登录的所有网站吗？
是的，Chrome 集成共享你浏览器的登录状态，Claude 可以访问任何你已登录的网站（Google Docs、Gmail、Notion 等），无需 API 连接器。遇到登录页或 CAPTCHA 时会暂停等待手动处理。
Q: 如果不想每次都加 --chrome 参数，怎么设置默认开启？
在 Claude Code 会话中运行 /chrome，选择"Enabled by default"即可。注意默认开启会增加上下文用量（浏览器工具始终加载），如果上下文消耗增加明显，可关闭改为按需使用。
Q: Chrome 集成、Computer Use 和 Playwright 有什么区别？
Chrome 集成适合在真实浏览器里快速点一遍页面、读控制台和复现问题；Computer Use 适合控制原生应用、模拟器和非浏览器 GUI；Playwright 适合把稳定路径沉淀成可重复运行的自动化测试。实际工作中常见顺序是：Chrome 集成探索问题 → 修复页面 → Playwright 固化回归测试。
Q: Claude Code 自动打开浏览器测试安全吗？
要按站点权限和会话授权来控制边界。不要让 Claude 处理未知网站里的敏感操作；涉及付款、删除、发消息、提交外部表单时，先让它停在确认页，由你人工检查后再决定是否继续。