MCP 探索：browser tools MCP + Cursor 可以实现哪些能力

于 2025-05-03 17:52:37 发布
阅读量156 收藏 1
点赞数 1
分类专栏： m1 Python 领域 m4 杂项 m2 Java 领域 文章标签： Microsoft browser tools MCP 大模型 mcp
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_15071263/article/details/147685587
版权

简简单单 Online zuozuo ：本心、输入输出、结果

文章目录

MCP 探索：browser tools MCP + Cursor 可以实现哪些能力

编辑 | 简简单单 Online zuozuo
地址 | https://blog.csdn.net/qq_15071263

如果觉得本文对你有帮助，欢迎点赞、收藏、评论，谢谢

前言

BrowserTools MCP 是基于 Anthropic 的 Model Context Protocol (MCP) ，专为 AI 应用设计的浏览器监控与交互工具。MCP 作为标准协议，能让 AI 模型与不同数据源和工具有效交互。Cursor 则是和 AI 深入结合且问答功能免费的编程 IDE。当 BrowserTools MCP 与 Cursor 结合，会碰撞出怎样的火花呢？它们能实现数据捕获与监控

了解本专栏 订阅专栏 解锁全文 超级会员免费看
MCP 探索：Cursor + Figma-Context-MCP ，让 Cursor 获取 Figma 设计图信息，实现 AI 生成页面的高度还原
简简单单Onlinezuozuo
04-28 126
MCP（Model Context Protocol）是由 Anthropic 公司于 2024 年 11 月推出的一种开放协议。它旨在统一规范大语言模型与外部数据源和工具之间的通信，类似于 AI 世界的“USB-C”接口。MCP 基于客户端-服务器架构，包含宿主程序（Host）、客户端（Client）和服务器（Server）等组件。它通过标准化接口和协议，使大语言模型能够动态访问和集成外部数据源、工具和服务，提升模型的功能性和灵活性。
基于MCP的RAG系统实战：用Cursor+GroundX构建复杂文档问答引擎
这里汇聚了前沿的技术分享与实用的开发技巧，带你探索从创意到企业的技术创业之路。
04-19 271
通过本文，开发者可快速掌握MCP+RAG的实战方法，将复杂文档转化为可交互的知识资产，为AI赋能的生产力革命提供技术支撑。未来，随着MCP协议的完善与GroundX功能的扩展，该系统可进一步集成。：员工通过Cursor查询公司内部的API文档，自动获取代码示例。为复杂文档的智能问答提供了全新解决方案。（MCP服务器）的组合，构建一个可处理科研文献、企业知识库的。，按照本文配置步骤搭建你的智能文档问答系统！等功能，成为企业与科研机构的智能助手标配。在AI与文档处理的融合趋势下，访问GitHub项目。
使用 Cursor 控制 Blender —— Blender MCP 全流程实践及问题排查
lnsnxaq的博客
04-11 1387
​ 本文介绍如何利用 blender-mcp 项目，在 Blender 中搭建 MCP 后端，通过 Cursor 控制 Blender，实现例如创建物体等自动化操作。本方案与之前 Unity MCP 独立运行，两者互不干扰，可根据需要分别启用。
cursor在win下配置browser-tools-mcp
m0_54204465的博客
03-12 3160
名字填写browser-tools-mcp，其中window 环境下 Command 配置是。点击加载已解压的扩展程序，选择chrome-extension。首先打开谷歌浏览器拓展管理。然后重启一下谷歌浏览器。在cursor里面设置。
解决：cline安装browser-tools-mcp服务时报错无法连接
xiaominglei001的专栏
03-17 1430
确保已安装 browser-tools-server、browser-tools-mcp 和 Chrome 扩展。我通过指定完整的服务器路径解决了这个问题。
windows cursor下使用MCP工具 BrowserTools 的安装步骤
weixin_44903776的博客
03-21 2216
在“功能”中，找到“MCP 服务器”，点击“添加新 MCP 服务器”。直接询问cursor 你能获取控制台内容吗？将自动调用mcp工具。观察下图部分是否有绿色亮点，有的话则部署成功。打开 Cursor 设置。
从手动调试到AI助力：BrowserTools MCP重构软件测试流程
software_test010的博客
04-07 814
BrowserTools MCP的出现，只是软件测试领域变革的开始。 它不仅解决了传统测试中的诸多痛点，还为未来的发展开辟了广阔的空间。如果你还在为前端测试的效率和质量而烦恼，不妨立即体验BrowserTools MCP，亲身感受它的强大功能。
实验 Figma MCP + Cursor 联合工作流
roamingcode的博客
02-22 3577
使用此 Model Context Protocol 服务器授予 Cursor 对 Figma 文件的访问权限。当 Cursor 可以访问 Figma 设计数据时，它比粘贴屏幕截图等其他方法更能准确地进行代码转化。具体配置方式可直接参考仓库中详细介绍。
MCP 架构设计深度剖析：使用 Spring AI + MCP 四步教你实现 Agent 智能体开发.pdf
04-11
MCP 架构设计深度剖析：使用 Spring AI + MCP 四步教你实现 Agent 智能体开发.pdf
使用browsertools mcp 时，谷歌浏览器必须安装的插件
03-15
使用browsertools mcp 时，谷歌浏览器必须安装的插件
browser-tools-mcp：让AI工具更智能，提升浏览器交互能力
gitblog_00483的博客
03-26 1149
browser-tools-mcp：让AI工具更智能，提升浏览器交互能力 browser-tools-mcp Monitor browser logs directly from Cursor and other MCP compatible IDEs. ...
BrowserTools MCP：比Playwright更高效的AI驱动浏览器自动化工具
东方佑
04-08 1072
BrowserTools MCP不仅是一款工具，更是AI与开发工具融合的缩影。无论是调试复杂应用、优化SEO，还是快速响应用户需求，BrowserTools都在重新定义“高效开发”的边界。相比传统的Playwright和Puppeteer，它通过直接控制用户当前浏览器会话，无需启动新实例，显著降低了资源消耗，同时提供了AI辅助调试、SEO审计、DOM编辑等强大功能。“相比Playwright，BrowserTools的AI调试模式节省了我50%的排查时间。在AI与开发工具深度融合的今天，
Cursor + MCP：效率狂飙，一键克隆网站、自动调试错误，社区：每个人都在谈论MCP。
lythinking的博客
03-07 3706
你现在在一个next.js项目中，调用firecrawl去复刻这个网站：https://pidgeon.news/?工作流程是这样的：遍历页面，提取元素，下载资源，重建结构。核心是分析网页的DOM结构和资源。它能读取浏览器控制台和网络日志，用Replicate生成UI资源，连接Supabase数据库和Figma设计。先在本地运行网站，然后让Playwright去访问，它会把看到的情况都记录下来，帮我们发现问题。AI 需要与现实世界的数据建立联系，MCP 即将变得极为重要，开发工具正在走向一个全新的时代。
Cursor+MCP，30分钟开发并部署赛博算命网站
qq_40653180的博客
03-02 2033
通过AI快速开发+部署一个“赛博算命”程序
MCP简介：从浏览器截图的自动化说起，从零基础到精通，收藏这篇就够了！
leah126的博客
03-18 1486
(MCP) 是由Anthropic公司推出的一个开放协议，它标准化了应用程序如何向大型语言模型 (LLM) 提供上下文和工具的方式。我们可以将 MCP 理解为 AI 应用的"USB-C 接口"——就像 USB-C 为各种设备提供了标准化的连接方式，MCP 为 AI 模型提供了与不同数据源和工具连接的标准化方式。读取和写入本地文件查询数据库执行命令行操作控制浏览器与第三方 API 交互这极大地扩展了 AI 助手的能力边界，使其不再仅限于对话框内的文本交互。
我让AI接管了浏览器！Browser Tools MCP教程：自动Debug+截屏+SEO分析
最新发布
seeyouintokyo的博客
05-03 1917
小白友好，且效率翻倍
Cursor mcp工具推荐
04-15
<think>好的，用户想找与Cursor MCP相关的工具推荐。首先，我需要明确什么是Cursor MCP。根据引用[1]和[2]，Cursor Talk To Figma MCP是一个允许在Cursor IDE中与Figma设计文件直接交互的项目，方便开发者同步设计资源和代码。而引用[3]提到的浏览器工具MCP可以监控浏览器日志，适合调试。引用[4]则介绍了Cursor插件的安装和使用方法，提到了Prettier等插件。 用户可能需要的是能够提升在Cursor中使用MCP功能的工具或插件。首先，基础的MCP工具如Figma集成和浏览器日志监控已经存在，但用户可能还需要其他辅助工具。例如，代码格式化插件如Prettier（引用[4]）能帮助保持代码整洁，这对使用MCP项目很重要。此外，是否需要调试工具或协作工具？比如实时协作插件或API测试工具，这些都能提升开发效率。 另外，用户可能不熟悉如何安装和配置这些插件，所以需要提供安装指南的参考，如引用[4]中的步骤。还要考虑是否需要推荐版本控制工具，如Git集成，方便团队协作。可能还需要自动化工具来简化流程，如自动化测试或部署。最后，综合这些信息，整理出一个清晰的推荐列表，并附上相关引用，确保用户能顺利找到和使用这些工具。</think>### 推荐与Cursor MCP相关的工具及插件 #### 1. **Figma设计协作工具** - **Figma MCP集成插件**：支持在Cursor IDE中直接查看和编辑Figma设计文件，实现设计与代码同步[^1]。 - **功能亮点**： - 实时预览设计资源（如颜色变量、组件库）。 - 自动生成设计稿对应的代码片段。 - **安装方法**：通过Cursor插件市场搜索“Figma MCP”安装[^4]。 #### 2. **浏览器日志监控工具** - **Browser Tools MCP**：用于在Cursor中直接监控浏览器控制台日志、网络请求和性能数据，适合前端调试[^3]。 - **应用场景**： - 调试网页与MCP项目的交互逻辑。 - 分析API请求响应耗时。 #### 3. **代码质量工具** - **Prettier代码格式化插件**：自动格式化代码，保持团队代码风格统一（尤其适用于多人协作的MCP项目）[^4]。 - **配置建议**： - 在Cursor设置中启用“保存时自动格式化”。 - 自定义`.prettierrc`文件适配项目规范。 #### 4. **API调试与模拟工具** - **Postman Cursor插件**：在IDE内直接发送API请求并测试MCP后端接口。 - **优势**： - 无需切换工具即可调试RESTful API或GraphQL。 - 支持生成代码请求模板（如Python、JavaScript）。 #### 5. **版本控制集成** - **GitLens插件**：增强Cursor内置的Git功能，提供代码提交历史追溯、分支对比等功能[^4]。 - **适用场景**： - 管理MCP项目的迭代版本。 - 快速定位代码变更记录。 #### 6. **自动化测试工具** - **Jest/Cypress插件**：为MCP项目添加单元测试或端到端测试框架，支持测试用例编写与运行。 - **配置步骤**： - 通过Cursor插件市场安装测试插件。 - 在项目中初始化测试配置文件（如`jest.config.js`）。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

简简单单OnlineZuozuo

感谢哥哥姐姐的打赏

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值