1. 环境准备
首先确保系统已安装 Node.js。创建项目目录并克隆官方仓库，建议将路径设置在便于管理的文档目录下。
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 .
2. 安装与服务启动
进入目录后安装依赖并启动服务。注意版本匹配，这里以 v1.2.0 为例。实际运行时请根据网络情况调整镜像源。
npm install @agentdeskai/[email protected]
npx @agentdeskai/[email protected]
# 或者直接运行主程序
npx @agentdeskai/[email protected]
详细安装步骤可参考官方文档。服务启动后，控制台应显示监听状态。 ![截图：服务启动日志] ![截图：控制台输出]
3. 浏览器插件配置
下载并安装对应的浏览器扩展包。解压后加载到浏览器的扩展管理页面即可启用。
https://github.com/AgentDeskAI/browser-tools-mcp/releases/download/v1.2.0/BrowserTools-1.2.0-extension.zip
![截图：扩展安装界面]
4. Cline 服务配置
在 Cline 的配置文件中添加如下 MCP 服务定义。请根据实际路径修改 args 中的脚本位置，确保指向正确的 dist/mcp-server.js。
{
"browser-tools-mcp": {
"command": "node",
"args": ["<your_path>/browser-tools-mcp/dist/mcp-server.js"],
"disabled": false,
"autoApprove": []
}
}
5. 验证与效果
配置完成后，重启 Cline。浏览器端应能识别新增的调试工具面板，此时 AI 代理即可通过 MCP 协议调用浏览器能力，实现自动化操作。
![截图：浏览器调试工具界面] ![截图：工具功能展示]
