What is Website Scraper Mcp

website-scraper-mcp is a website replication tool based on the Model Context Protocol (MCP) that extracts the complete structure, resources, and functionalities of a website.

Use cases

Use cases include extracting a website’s DOM structure, gathering resource files, analyzing interaction logic, scanning entire websites for data, and retrieving backend information for API integration.

How to use

To use website-scraper-mcp, install it globally via npm with ‘npm install -g website-scraper-mcp’ or use npx directly. Start the MCP server with ‘npx website-scraper-mcp start’ and send commands through a large language model (LLM) to perform various scraping tasks.

Key features

Key features include the ability to scrape HTML DOM structure, resource files (images, videos, fonts), interaction logic (JavaScript files, event listeners), dynamic content (API requests, WebSocket communications), backend associations (routing rules, API documentation), and metadata for SEO optimization.

Where to use

website-scraper-mcp can be used in web development, data analysis, SEO optimization, and any field requiring comprehensive website data extraction.

网站复刻工具 (Website Scraper MCP)

基于Model Context Protocol协议的网站复刻工具，可提取网站的完整结构、资源和功能。

功能特点

该工具可以全面抓取网站的各个方面，包括：

1. 页面结构

• HTML DOM树（包含动态生成节点）
• 内联样式 (style 属性)
• 外部CSS文件链接及内容

2. 资源文件

• 图片文件（<img>、background-image）
• 视频/音频文件
• 字体文件（@font-face）
• SVG图标及矢量图形
• 第三方库 CDN 链接（如 React、jQuery）

3. 交互逻辑

• JavaScript文件（外部.js和内联脚本）
• 事件监听器列表（click, input, scroll等）
• 本地存储数据（localStorage, sessionStorage）
• Cookie数据

4. 动态内容

• API请求数据（XHR/Fetch响应，含JSON/XML）
• WebSocket通信记录（如实时聊天）
• 懒加载资源（滚动触发的图片/内容）

5. 后端关联

• 路由规则（URL动态参数、哈希路由）
• 接口文档（请求头、鉴权方式）
• 服务器渲染初始HTML（如SSR页面）

6. 元数据与优化

• SEO元标签（<meta>, canonical）
• 结构化数据（Schema.org, JSON-LD）
• 资源预加载配置（preload, prefetch）

安装

npm install -g website-scraper-mcp

或者直接使用npx:

npx website-scraper-mcp

使用方法

本工具是基于Model Context Protocol协议设计的，主要用于与大型语言模型（如Claude或者GPT）一起使用。

启动MCP服务器

npx website-scraper-mcp start

然后，通过LLM（大型语言模型）向服务器发送命令。以下是一些示例：

使用示例（通过LLM发送）

1. 获取网页DOM结构：

   使用get-dom-structure工具抓取https://example.com的DOM结构
   

2. 获取网页资源：

   使用get-resources工具抓取https://example.com的资源文件，只获取图片和字体
   

3. 获取交互逻辑：

   使用get-interactions工具抓取https://example.com的交互逻辑，包括事件监听器
   

4. 全站扫描：

   使用scan-website工具扫描https://example.com，最大抓取10个页面，深度为2，以json格式返回
   

查看可用工具列表

npx website-scraper-mcp help-tools

可用工具

1. get-dom-structure

   • 获取网页的HTML DOM结构，包括动态生成的节点和样式
   • 参数：url, includeStyles, includeDynamicNodes

2. get-resources

   • 获取网页中使用的资源文件
   • 参数：url, resourceTypes, downloadResources

3. get-interactions

   • 获取网页的交互逻辑，包括事件监听器和存储信息
   • 参数：url, captureEventListeners, captureStorage, captureCookies

4. get-dynamic-content

   • 获取网页的动态内容，包括API请求和WebSocket通信
   • 参数：url, captureApiRequests, captureWebSockets, captureLazyLoading, monitorTime

5. get-backend-info

   • 获取网页的后端关联信息，包括路由规则和API接口
   • 参数：url, detectRoutes, inferApi, detectServerRendering

6. get-metadata

   • 获取网页的元数据和优化信息
   • 参数：url, captureSeo, captureStructuredData, captureResourceHints

7. scan-website

   • 综合扫描整个网站
   • 参数：url, maxPages, depth, includeAll, outputFormat

系统要求

• Node.js 16.0.0 或更高版本
• 支持Chrome浏览器的环境（Puppeteer依赖）

许可证

MIT

鸣谢

本项目基于以下优秀的开源项目：

• Model Context Protocol
• Puppeteer
• Commander.js
• Cheerio