MCP 服务集成实战：browser-tools-mcp 配置教程

环境准备

首先确认本地已安装 Python 和 Node.js 环境。在合适的位置创建项目目录，比如用户文档下的 Cline 配置区，然后拉取源码。

mkdir -p ~/Documents/Cline/MCP/browser-tools-mcp
cd ~/Documents/Cline/MCP/browser-tools-mcp
git clone https://github.com/AgentDeskAI/browser-tools-mcp.git .

安装与服务启动

进入目录后执行依赖安装。这里以 v1.2.0 版本为例，启动相应的 Server 和 MCP 进程。

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

详细安装流程可查阅官方文档。

![MCP 服务运行状态] ![终端日志输出]

浏览器插件配置

需要安装配套的浏览器扩展才能启用调试功能。

下载地址：https://github.com/AgentDeskAI/browser-tools-mcp/releases/download/v1.2.0/BrowserTools-1.2.0-extension.zip

安装后，浏览器侧将增加调试工具入口。

![浏览器插件图标]

Cline 服务配置

在 Cline 的配置文件中注册该 MCP 服务。注意修改 args 中的路径为你实际的服务器脚本位置。

{
  "browser-tools-mcp": {
    "command": "node",
    "args": ["<your_project_path>/dist/mcp-server.js"],
    "disabled": false,
    "autoApprove": []
  }
}

效果验证

完成上述步骤后，浏览器端即可正常使用调试工具。