Chrome DevTools MCP 让这件事变得出奇简单。

什么是 Chrome DevTools MCP

MCP（Model Context Protocol）是让 AI Agent 连接外部工具的标准协议。Chrome DevTools MCP 就是基于这个协议，把 Chrome 浏览器的调试能力暴露给 AI Agent。

这意味着什么？你的 Coding Agent 可以直接访问你正在运行的 Chrome 会话——包括打开的标签页、Cookie、登录状态、控制台日志、网络请求，所有你在 DevTools 里能看到的东西，Agent 都能看到。

不需要安装任何浏览器扩展，底层用的就是 Chrome 原生的远程调试协议。

三步完成配置

设置过程简单到让人怀疑"就这？"：

  1. 在 Chrome 地址栏输入 chrome://inspect/#remote-debugging
  2. 打开远程调试的开关
  3. 没有第三步了——你的 Agent 现在就能连接到你的浏览器

当然，你还需要在 Agent 端配置 Chrome DevTools MCP Server，让它自动连接到正在运行的 Chrome 实例。具体的 MCP Server 配置取决于你用的 Agent 框架（比如在 Claude Code 或 OpenClaw 中添加对应的 MCP 配置）。

这对一人公司意味着什么

想象一下这些场景：

  • 你在开发一个 Web 应用，前端出了 bug。以前你要截图、复制报错信息、粘贴到对话框里描述问题。现在 Agent 直接连上你的浏览器，自己看控制台报错，自己检查 DOM 结构，然后直接改代码。
  • 你在调试一个需要登录态的 API 接口，Agent 能直接读取你浏览器里的 Cookie 和 Session，不用你手动复制 token。
  • 你想让自动化工作流操作一个已经登录好的后台管理页面，不再需要单独处理复杂的登录流程。

对独立开发者来说，这类工具的价值不在于"酷"，而在于它砍掉了人和 AI 之间最大的信息断层——上下文传递的摩擦。你不用再当 Agent 和浏览器之间的"翻译官"了。

安全提醒

既然 Agent 能看到你的标签页、Cookie 和登录状态，安全边界就值得认真想一想。几个建议：

  • 只在本地开发环境开启远程调试，不要在生产机器上打开
  • 用完及时关闭 chrome://inspect 中的远程调试开关
  • 注意你授权 Agent 访问的范围——它能看到的不只是你当前在调试的那个页面，而是所有打开的标签页

把浏览器的完整调试能力交给 AI Agent，是效率的巨大提升，但前提是你清楚自己开放了什么。这个边界，你会怎么划？