跳到主要内容
极客日志极客日志面向AI+效率的开发者社区
首页博客我的书AI学习GitHub 精选镜像AI工具UI配色美学关于
搜索内容 / 工具 / 仓库 / 镜像...⌘K搜索
注册
博客列表
JavaScriptNode.jsAI大前端

MCP 插件配置实战:browser-tools-mcp 集成指南

MCP 插件配置实战主要介绍 browser-tools-mcp 的安装流程。涵盖环境准备、服务启动、浏览器插件安装及 Cline 配置文件编写。通过具体命令和代码示例,帮助开发者快速集成浏览器自动化工具到 AI 工作流中,实现高效的调试与交互体验。

Pythonist发布于 2026/2/14更新于 2026/10/2496 浏览
MCP 插件配置实战:browser-tools-mcp 集成指南

环境准备

首先确保本地已安装 Python 和 Node.js 环境。接着创建项目目录并克隆仓库,建议将路径替换为你自己的用户目录:

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

服务安装与启动

进入目录后,安装依赖并启动服务。这里我们指定版本以确保稳定性:

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

官方文档提供了更详细的安装指引,建议查阅 Installation Guide。

浏览器插件配置

下载并安装对应的浏览器扩展程序,这是实现浏览器交互的关键组件:

BrowserTools 扩展下载

安装完成后,你会在浏览器中看到新增的工具面板。

安装后的浏览器工具栏

Cline 服务配置

在 Cline 的配置文件中添加以下 MCP 服务定义,注意路径需根据实际安装位置调整:

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

验证效果

配置生效后,浏览器端应能正常显示调试工具页面,此时即可通过 MCP 协议调用浏览器能力进行自动化操作。

浏览器端调试工具增加

工具面板展示

功能运行示意

目录

  1. 环境准备
  2. 服务安装与启动
  3. 浏览器插件配置
  4. Cline 服务配置
  5. 验证效果

更多推荐文章

查看全部
  • 2026 年 3 月 13 日 AI 热点:芯片竞争、Agent 爆发与安全争议
  • 昇腾 NPU 实战指南:部署与推理 CodeLlama
  • OpenClaw 框架解析:AI Agent、RAG、MCP 与 Skills 核心概念梳理
  • Spring Web MVC 核心概念与实战指南
  • 树莓派 Python 音频播放开发实战指南
  • Visual C++ 运行库缺失问题排查与修复指南
  • 二分答案专题实战:木材加工与砍树问题详解
  • 大模型转行指南:四大方向解析与入行建议
  • Ubuntu 24.04 更换阿里云镜像源指南
  • PostgreSQL 18 默认密码修改与安全加固指南
  • 鸿蒙金融理财全栈项目:运维监控、性能优化与安全加固
  • Clang Power Tools:在 Visual Studio 里做 C++ 静态分析
  • 大模型基本概念详解:定义、发展、特点与分类
  • 大模型技术从基础入门到实战应用指南
  • 使用 cpolar 实现 Open-Lovable 远程访问与网页克隆
  • C++ 结构体基础:定义、成员函数与排序
  • ThreadLocal 原理、使用场景及内存泄漏问题详解
  • Git 基础教程:从零理解版本控制与团队协作
  • World Monitor:AI 驱动的全球情报仪表盘与态势感知平台
  • 数值分析:前向误差与后向误差,好算法为何不怕输入错一点

相关免费在线工具

  • RSA密钥对生成器

    生成新的随机RSA私钥和公钥pem证书。 在线工具,RSA密钥对生成器在线工具,online

  • Mermaid 预览与可视化编辑

    基于 Mermaid.js 实时预览流程图、时序图等图表,支持源码编辑与即时渲染。 在线工具,Mermaid 预览与可视化编辑在线工具,online

  • 随机西班牙地址生成器

    随机生成西班牙地址(支持马德里、加泰罗尼亚、安达卢西亚、瓦伦西亚筛选),支持数量快捷选择、显示全部与下载。 在线工具,随机西班牙地址生成器在线工具,online

  • Keycode 信息

    查找任何按下的键的javascript键代码、代码、位置和修饰符。 在线工具,Keycode 信息在线工具,online

  • Escape 与 Native 编解码

    JavaScript 字符串转义/反转义;Java 风格 \uXXXX(Native2Ascii)编码与解码。 在线工具,Escape 与 Native 编解码在线工具,online

  • JavaScript / HTML 格式化

    使用 Prettier 在浏览器内格式化 JavaScript 或 HTML 片段。 在线工具,JavaScript / HTML 格式化在线工具,online