MCP 插件实战：Browser Tools 集成指南

环境准备

首先确保本地已安装 Python 和 Node.js 环境。接着创建 MCP 插件目录并克隆仓库。

mkdir "C:\\Users\\<用户名>\\Documents\\Cline\\MCP\\browser-tools-mcp"
cd "C:\\Users\\<用户名>\\Documents\\Cline\\MCP\\browser-tools-mcp"
git clone https://github.com/AgentDeskAI/browser-tools-mcp.git .

安装与服务启动

进入项目目录后，使用 npm 安装依赖并启动服务。注意版本号需与实际发布一致。

npm install @agentdeskai/[email protected]
npx @agentdeskai/[email protected]
npx @agentdeskai/[email protected]

官方文档提供了详细的安装指引，可参考 Browser Tools 安装说明。

浏览器插件配置

下载并安装对应的浏览器扩展程序，版本建议与 MCP 服务端保持一致。

下载地址：BrowserTools-1.2.0-extension.zip

安装完成后，浏览器侧边栏应出现调试工具入口。

Cline 服务配置

在 Cline 的配置文件中添加以下 MCP 服务定义。请根据实际路径调整 args 中的文件位置。

{
  "browser-tools-mcp": {
    "command": "node",
    "args": [
      "C:\\Users\\<用户名>\\Documents\\Cline\\MCP\\browser-tools-mcp\\dist\\mcp-server.js"
    ],
    "disabled": false,
    "autoApprove": []
  }
}

效果验证

配置生效后，打开浏览器开发者工具或侧边栏，应能看到新增的调试面板。此时 AI Agent 即可通过 MCP 协议调用浏览器功能进行自动化操作。