HTML提取工具

一个通过Chrome DevTools协议从Chrome页面提取原始HTML内容的工具,支持获取整个页面或特定元素的HTML。

  • by HK-Zhang
  • JavaScript
  • 本地部署
  • 更新于
在 GitHub 查看 HK-Zhang/CrawlMCP

使用说明

CrawlMCP

一个模型上下文协议(MCP)服务器,通过Chrome DevTools协议从Chrome页面获取原始HTML内容。旨在补充 chrome开发工具mcp 通过提供HTML提取功能。

特性

  • get_page_html:获取任何打开的Chrome页面的完整原始HTML,或使用CSS选择器提取特定元素的HTML
  • list_chrome_pages:列出Chrome中可用于HTML提取的所有打开页面

先决条件

  • Node.js 18+
  • Chrome/Chromium在启用远程调试的情况下运行

使用远程调试启动Chrome

# Windows
chrome.exe --remote-debugging-port=9222

# macOS
/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --remote-debugging-port=9222

# Linux
google-chrome --remote-debugging-port=9222

安装

npm install
npm run build

用法

在VS代码中配置(副本)

添加到您的VS代码 settings.json:

{
  "mcp": {
    "servers": {
      "crawl-mcp": {
        "type": "stdio",
        "command": "npx",
        "args": [
          "-y",
          "crawl-mcp"
        ]
      }
    }
  }
}

在Claude桌面中配置

添加到 claude_desktop_config.json:

{
  "mcpServers": {
    "crawl-mcp": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "crawl-mcp"
      ]
    }
  }
}

环境变量

变量 默认值 描述
CDP_HOST localhost Chrome DevTools协议主机
CDP_PORT 9222 Chrome DevTools协议端口

工具

get_page_html

从打开的Chrome页面获取原始HTML内容。

参数:

  • pageIndex (数字,可选):页面索引(从0开始)。默认为0。
  • selector (string,可选):CSS选择器,用于获取特定元素的HTML。

示例:

获取整页HTML:

Use the get_page_html tool to fetch the HTML from the first Chrome tab

获取特定元素:

Use get_page_html with selector "#main-content" to get only that section

list_chrome_pages

列出可通过Chrome DevTools协议访问的所有打开页面。

退货: 对象数组 index, title,以及 url.

与chrome devtools mcp一起使用

此MCP旨在与chrome devtools MCP一起工作。使用chrome devtools mcp:

  • 导航和页面交互
  • 截图和快照
  • 控制台和网络监控

使用CrawlMCP进行以下操作:

  • 提取原始HTML源代码
  • 获取特定DOM元素的HTML

许可证

麻省理工学院