关于 Browser Devtools MCP
基于 Playwright 的 MCP 服务，将实时浏览器作为 AI Agent 的可追踪、可检查、可调试和可控制的执行环境公开。
配置
远程服务无需本地安装。选择你使用的客户端，复制配置或使用一键安装。
服务地址
https://{your_mcp_server_host}/mcp一键复制安装命令
Claude CodeTerminal
claude mcp add --transport http browser-devtools https://{your_mcp_server_host}/mcpCursor.cursor/mcp.json
{"mcpServers":{"browser-devtools":{"type":"http","url":"https://{your_mcp_server_host}/mcp"}}}在 Cursor 中打开VS Code.vscode/mcp.json
{"servers":{"browser-devtools":{"type":"http","url":"https://{your_mcp_server_host}/mcp"}}}在 VS Code 中打开Claude Desktopclaude_desktop_config.json
{"mcpServers":{"browser-devtools":{"type":"http","url":"https://{your_mcp_server_host}/mcp"}}}Windsurf~/.codeium/windsurf/mcp_config.json
{"mcpServers":{"browser-devtools":{"serverUrl":"https://{your_mcp_server_host}/mcp"}}}命令在终端中运行；JSON 粘贴到对应客户端的 MCP 配置后重启。需要授权的服务会在首次连接时提示登录。
工具
51| 参数 | 类型 | 必填 | 说明 |
|---|---|---|---|
| selector | string | 否 | 将范围限定为此元素；省略则表示整个页面。 |
| interactiveOnly | boolean | 否 | 仅为交互元素分配 refs。 |
| maxDepth | integer | 否 | 树的最大深度；0 = 仅根节点。 |
| compact | boolean | 否 | 省略不含内容的结构节点。 |
| cursorInteractive | boolean | 否 | 包含 cursor:pointer / onclick 元素。 |
详细介绍
维护者还没有提供详细介绍，可以先查看代码仓库中的 README。
评论
支持 Markdown
一个开放协议，规定了 AI 应用如何以统一方式连接外部工具与数据源。客户端负责与模型对话，MCP 服务负责提供工具、资源和提示模板，两者通过标准消息通信，同一个服务可以被不同客户端复用。