cursor在win下配置browser-tools-mcp

browser-tools-mcp这个工具提供了多个功能:

  • 获取控制台日志(Console log)
  • 网络请求监控(Network monitoring)
  • 截图功能(Screenshot capture)
  • 元素选择(Element selection)
  • 浏览器状态分析(Browser state analysis)
  • 可访问性和性能审计(Accessibility and performance audits)sho

首先打开谷歌浏览器拓展管理

点击加载已解压的扩展程序,选择chrome-extension

就是这个

然后重启一下谷歌浏览器

检查环境

node -v
npm -v

在终端安装

npx @agentdeskai/browser-tools-mcp@1.2.0
npx @agentdeskai/browser-tools-server@1.2.0

需要按照正确的顺序启动两个服务:

首先启动 Browser Tools Server:

npx @agentdeskai/browser-tools-server

然后在另一个终端启动 MCP server:

npx @agentdeskai/browser-tools-mcp

在cursor里面设置

名字填写browser-tools-mcp,其中window 环境下 Command 配置是

cmd /c npx -y @agentdeskai/browser-tools-mcp@1.2.0

 效果如下:

注意:

浏览器显示调试信息才算成功

还有

如果安装报错,大概是防火墙的问题,比如

Attempting initial server discovery on startup...
Starting server discovery process
Will try hosts: 127.0.0.1, 127.0.0.1, localhost
Will try ports: 3025, 3026, 3027, 3028, 3029, 3030, 3031, 3032, 3033, 3034, 3035
Checking 127.0.0.1:3025...
Error checking 127.0.0.1:3025: fetch failed
Checking 127.0.0.1:3026...
Error checking 127.0.0.1:3026: fetch failed
Checking 127.0.0.1:3027...
Error checking 127.0.0.1:3027: fetch failed
Checking 127.0.0.1:3028...
Error checking 127.0.0.1:3028: fetch failed
Checking 127.0.0.1:3029...

将3025到3030的端口允许本机连接即可

    ### 关于 MCP 开源项目的详细介绍 #### 1. **browser-tools-mcp** `browser-tools-mcp` 是一个用于直接从 Cursor 和其他兼容 MCP 的集成开发环境 (IDE) 中监视浏览器日志的工具[^1]。该项目的主要目标是简化前端调试流程,使开发者能够更高效地分析和处理浏览器中的运行时行为。 - **项目地址**: [https://gitcode.com/gh_mirrors/br/browser-tools-mcp](https://gitcode.com/gh_mirrors/br/browser-tools-mcp) - **核心功能**: - 实时捕获并显示浏览器的日志数据。 - 提供灵活的过滤机制以便快速定位特定类型的日志条目。 - 支持多种主流 IDE 集成,提升跨平台协作效率。 以下是安装 `browser-tools-mcp` 的基本命令示例: ```bash git clone https://gitcode.com/gh_mirrors/br/browser-tools-mcp.git cd browser-tools-mcp npm install npm start ``` --- #### 2. **mcp-server-qdrant** `mcp-server-qdrant` 致力于解决 Qdrant 向量数据库的手动管理难题,通过引入统一的控制平面来降低复杂度[^2]。它不仅提供了便捷的一键式集群管理模式,还增强了安全性与可扩展性。 - **主要特性**: - 统一化的 API 接口设计,便于自动化脚本调用。 - 自动化节点发现与负载均衡优化策略。 - 增强的安全选项,例如内置 SSL/TLS 加密支持以及细粒度权限控制系统。 对于希望深入研究此项目的用户而言,可以从官方文档获取更多细节指导: - **下载链接**: 参考 GitHub 或 GitCode 上的相关仓库资源。 - **技术文档**: 官方 README 文件通常会包含详细的入门指南和技术架构说明。 --- #### 3. **FPGA/CAN 相关开源项目** 尽管上述两个项目属于不同领域,但在嵌入式系统方向上也有值得注意的内容——即基于 FPGA 的 CAN 总线实现方案[^3]。这类硬件级解决方案广泛应用于工业自动化、汽车电子等领域。 具体来说,“stm32f0 + TJA1051/3”组合是一种常见且经济高效的 USB-to-CAN 转换器设计方案。其优势在于成本低廉的同时保持较高的可靠性水平。 如果对此类主题感兴趣,则可以进一步探索如下方面: - 如何利用 Verilog 编写自定义逻辑电路? - STM32 微控制器驱动程序编写技巧有哪些? --- ###
    评论 1
    添加红包

    请填写红包祝福语或标题

    红包个数最小为10个

    红包金额最低5元

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

    打赏作者

    m0_54204465

    你的鼓励将是我创作的最大动力

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

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

    打赏作者

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

    抵扣说明:

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

    余额充值