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

MCP 插件配置指南：browser-tools-mcp 示例

MCP 插件配置涉及环境准备、服务安装、浏览器插件及编辑器集成。首先安装 Python 与 Node.js，克隆 browser-tools-mcp 仓库并执行 npm 安装。随后下载浏览器扩展并在 Cline 中配置 MCP 服务命令。完成配置后，浏览器端将显示调试工具页面，实现 AI 代理对浏览器的控制能力。

FrontendX发布于 2026/2/23更新于 2026/6/217 浏览
MCP 插件配置指南：browser-tools-mcp 示例

1. 环境配置

  • 安装 Python
  • 安装 Node.js
  • 创建目录并克隆仓库
mkdir ~/Documents/Cline/MCP/browser-tools-mcp
cd ~/Documents/Cline/MCP/browser-tools-mcp
git clone https://github.com/AgentDeskAI/browser-tools-mcp.git .

2. MCP 服务安装启动

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

参考官方文档：Installation

图片

图片

图片

图片

图片

图片

3. 浏览器插件配置

下载地址：BrowserTools Extension

图片

4. Cline 服务配置

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

5. 最终效果

浏览器端调试工具增加了插件页面。

图片

图片

图片

目录

  1. 1. 环境配置
  2. 2. MCP 服务安装启动
  3. 3. 浏览器插件配置
  4. 4. Cline 服务配置
  5. 5. 最终效果
  • 💰 8折买阿里云服务器限时8折了解详情
  • Magick API 一键接入全球大模型注册送1000万token查看
  • 🤖 一键搭建Deepseek满血版了解详情
  • 一键打造专属AI 智能体了解详情
极客日志微信公众号二维码

微信扫一扫，关注极客日志

微信公众号「极客日志V2」，在微信中扫描左侧二维码关注。展示文案：极客日志V2 zeeklog

更多推荐文章

查看全部
  • Figma Make 实测：AI 生成的前端代码靠谱吗？
  • Vue + Node.js + ElementUI 大学生创新项目管理系统
  • 通义万相 2.1 开源视频生成模型功能解析与部署指南
  • C++11 新特性深度解析：从可变参数模板到 Lambda 表达式
  • 18 款 AI Agent 框架技术选型对比：OpenClaw/KimiClaw/MaxClaw 等
  • Web 架构深度解析：前后端分离与传统模式对比
  • PyCharm 报错：JetBrains AI URL resolution failure
  • Harness Engineering 工程化教程：AI Agent 复杂长任务可靠执行
  • 大模型训练全流程指南：预训练与指令微调
  • 大模型如何逐步侵蚀人类对真相的认知与信任
  • DeepSeek-R1 大模型基于 MS-Swift 框架的部署推理与微调实践
  • Faster-Whisper 本地部署与实时语音转文本教程
  • OpenClaw 本地部署及飞书远程控制配置指南
  • Python ETL 框架：流处理、实时分析与 RAG 驱动的智能数据管道
  • 滑动窗口算法实战：最大连续 1 与最小操作数
  • WebPlotDigitizer 图表数据提取指南：从图像到精准数值的转换
  • PyBullet 筛选机器人可动关节、校准零位姿态及获取末端执行器位置
  • 讯飞星辰 Astron 智能体本地化部署实战指南
  • AIGC 在现代教育技术中的应用与前景
  • Python Msgpack：高效二进制序列化库

相关免费在线工具

  • 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