Skip to main content
Glama
syunnrai123

Edge DevTools MCP

by syunnrai123

Edge DevTools MCP

一个用于与 Microsoft Edge 浏览器 DevTools 协议集成的 MCP (Model Context Protocol) 服务器。

功能特性

  • 🌐 连接和控制 Microsoft Edge 浏览器

  • 🔧 完整的 DevTools 协议支持

  • 📸 页面截图功能

  • 🎯 DOM 操作和查询

  • ⚡ JavaScript 代码执行

  • 🌍 网络请求监控

  • 🔍 页面元素自动化操作

Related MCP server: Chrome DevTools MCP

安装

npm install edge-devtools-mcp

使用方法

环境变量配置

可以通过以下环境变量配置连接参数:

  • EDGE_DEBUG_PORT: Edge 调试端口(默认:9222)

  • EDGE_DEBUG_HOST: 调试主机(默认:localhost)

  • EDGE_HEADLESS: 是否无头模式(默认:false)

  • EDGE_BROWSER_PATH: Edge 浏览器可执行文件路径

启动 Edge 调试模式

在使用前,需要以调试模式启动 Edge 浏览器:

Windows:

msedge.exe --remote-debugging-port=9222 --user-data-dir="C:\edge-dev-debug"

macOS:

/Applications/Microsoft\ Edge.app/Contents/MacOS/Microsoft\ Edge --remote-debugging-port=9222 --user-data-dir="/tmp/edge-dev-debug"

Linux:

microsoft-edge --remote-debugging-port=9222 --user-data-dir="/tmp/edge-dev-debug"

MCP 配置

在 Claude Desktop 的配置文件中添加:

{
  "mcpServers": {
    "edge-devtools": {
      "command": "node",
      "args": ["path/to/edge-devtools-mcp/dist/index.js"]
    }
  }
}

可用工具

浏览器连接

  • edge_connect: 连接到 Edge 浏览器

  • edge_disconnect: 断开连接

  • edge_get_targets: 获取所有可用目标

页面操作

  • edge_navigate: 导航到指定 URL

  • edge_screenshot: 截取页面截图

  • edge_get_page_content: 获取页面 HTML 内容

DOM 操作

  • edge_get_element: 获取元素信息

  • edge_click_element: 点击元素

  • edge_type_text: 在输入框中输入文本

  • edge_wait_for_selector: 等待元素出现

JavaScript 执行

  • edge_evaluate: 执行 JavaScript 表达式

DevTools 协议

  • edge_enable_devtools: 启用 DevTools 会话

  • edge_dom_query: 查询 DOM 节点

  • edge_get_attributes: 获取元素属性

使用示例

基本网页操作

// 连接到浏览器
await edge_connect();

// 导航到网页
await edge_navigate({ url: "https://example.com" });

// 等待页面加载
await edge_wait_for_selector({ selector: "body" });

// 获取页面内容
const { content } = await edge_get_page_content();

// 截取截图
const { screenshot } = await edge_screenshot({ format: "png" });

// 断开连接
await edge_disconnect();

表单填充示例

// 导航到登录页面
await edge_navigate({ url: "https://example.com/login" });

// 等待用户名输入框
await edge_wait_for_selector({ selector: "#username" });

// 填写表单
await edge_type_text({ selector: "#username", text: "myusername" });
await edge_type_text({ selector: "#password", text: "mypassword" });

// 点击登录按钮
await edge_click_element({ selector: "#login-button" });

JavaScript 执行示例

// 执行简单表达式
const { result } = await edge_evaluate({ expression: "document.title" });

// 执行复杂脚本
const { result } = await edge_evaluate({
  expression: `
    const links = Array.from(document.querySelectorAll('a')).map(a => a.href);
    return links.slice(0, 10);
  `
});

DevTools 协议示例

// 获取目标列表
const { targets } = await edge_get_targets();

// 启用 DevTools 会话
const { sessionId } = await edge_enable_devtools({ targetId: targets[0].id });

// 查询 DOM 节点
const { nodeId } = await edge_dom_query({
  sessionId,
  selector: "h1"
});

// 获取节点属性
const { attributes } = await edge_get_attributes({
  sessionId,
  nodeId
});

开发

构建项目

npm run build

开发模式

npm run dev

测试

npm test

代码检查

npm run lint

依赖项

  • @modelcontextprotocol/sdk: MCP SDK

  • puppeteer-core: 浏览器自动化

  • ws: WebSocket 客户端

许可证

MIT License

贡献

欢迎提交 Issue 和 Pull Request!

相关链接

A
license - permissive license
-
quality - not tested
F
maintenance

Maintenance

Maintainers
Response time
Release cycle
Releases (12mo)
Commit activity

Resources

Unclaimed servers have limited discoverability.

Looking for Admin?

If you are the server author, to access and configure the admin panel.

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/syunnrai123/Edge-DevTools-MCP'

If you have feedback or need assistance with the MCP directory API, please join our Discord server