Repolode
AgentDeskAI

AgentDeskAI/browser-tools-mcp

一个 MCP 服务器加 Chrome 扩展,让 AI 编程代理读取你已登录浏览器中的控制台日志、网络请求、截图和 Lighthouse 审计。

Star
7,332
Fork
536
未关闭 Issue
2
最近提交
9天前

这是什么?

BrowserTools MCP 让 AI 编程代理直接查看你正在调试的页面。它通过 DevTools 扩展接入你已经打开的 Chrome 会话,因此登录状态保持不变,代理可以读取控制台输出、网络请求、截图以及 Lighthouse 审计结果。支持 Cursor、Claude Code、Windsurf、Cline、Zed、Gemini CLI 等兼容 MCP 的客户端。

与 Chrome DevTools MCP、Playwright MCP 这类驱动全新自动化浏览器的工具不同,它面向的是调试正在运行的应用。无需在临时配置文件中重新登录。安装只需在客户端配置一条 npx 命令,并以解压方式加载仓库中的 Chrome 扩展,连接器由 MCP 服务器自行启动。

服务器只监听本机回环地址,HTTP 接口需要每次运行生成的令牌。采集的数据会去除 Authorization、Cookie 等请求头以及常见令牌格式的凭证。同时打开 DevTools 的多个标签页分别追踪,大体积数据以 MCP 资源形式提供,只在代理需要时才进入上下文。

核心功能

  • 01从当前 Chrome 标签页采集控制台日志、错误和网络请求。
  • 02截图并以图片形式返回给代理。
  • 03运行 Lighthouse 的无障碍、性能、SEO 和最佳实践审计。
  • 04在数据离开浏览器前去除采集内容中的凭证信息。
  • 05分别追踪多个标签页,工具可指定目标标签页 ID。
  • 06支持按关键词过滤和分页日志结果,控制返回内容的大小。

适用场景

  • 在已登录的页面上让代理诊断控制台报错。
  • 本地开发 Web 应用时排查失败或缓慢的 API 请求。
  • 无需单独测试配置文件,直接对页面运行 Lighthouse 审计。
  • 让代理通过实时页面截图检查界面改动的效果。

快速上手

  1. 1

    在 MCP 客户端配置中添加 MCP 服务器

    npx -y @agentdeskai/browser-tools-mcp@latest
  2. 2

    下载或克隆本仓库

  3. 3

    在 chrome://extensions 中开启开发者模式,选择 chrome-extension 目录以未打包方式加载

  4. 4

    在要检查的页面上打开 Chrome 开发者工具(F12)

使用前须知

  • 需要 Node 22.19 或更高版本。
  • Firefox 未经验证,视为不支持。
  • 网络抓取只记录打开开发者工具之后发出的请求。

收录于专题

标签

常见问题

browser-tools-mcp 是什么?
一个 MCP 服务器加 Chrome 扩展,让 AI 编程代理读取你已登录浏览器中的控制台日志、网络请求、截图和 Lighthouse 审计。 BrowserTools MCP 让 AI 编程代理直接查看你正在调试的页面。它通过 DevTools 扩展接入你已经打开的 Chrome 会话,因此登录状态保持不变,代理可以读取控制台输出、网络请求、截图以及 Lighthouse 审计结果。支持 Cursor、Claude Code、Windsurf、Cline、Zed、Gemini CLI 等兼容 MCP 的客户端。
browser-tools-mcp 可以免费使用吗?用的什么许可证?
browser-tools-mcp 以 MIT 许可证开源。用于商业产品前,请先确认许可证条款。
browser-tools-mcp 还在维护吗?
活跃维护中。browser-tools-mcp 最近一次提交是在 2026年10月16日。
browser-tools-mcp 适合用来做什么?
在已登录的页面上让代理诊断控制台报错。 本地开发 Web 应用时排查失败或缓慢的 API 请求。 无需单独测试配置文件,直接对页面运行 Lighthouse 审计。 让代理通过实时页面截图检查界面改动的效果。
browser-tools-mcp 怎么安装和运行?
在 MCP 客户端配置中添加 MCP 服务器: npx -y @agentdeskai/browser-tools-mcp@latest 下载或克隆本仓库 在 chrome://extensions 中开启开发者模式,选择 chrome-extension 目录以未打包方式加载 在要检查的页面上打开 Chrome 开发者工具(F12)
在哪里获取 browser-tools-mcp?
源代码和安装说明在 GitHub 上:https://github.com/AgentDeskAI/browser-tools-mcp

概要由 AI 根据项目 README 生成;GitHub 数据每日更新。

相关项目