# page-data-scraper

**Repository Path**: jcpbadboy/page-data-scraper

## Basic Information

- **Project Name**: page-data-scraper
- **Description**:  页面数据采集器
- **Primary Language**: JavaScript
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-07-24
- **Last Updated**: 2026-07-24

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 页面数据采集器

一款功能强大的浏览器数据采集插件，支持自动识别页面数据、交互式字段选择、批量采集，并严格遵守网站 Robots 协议。

## ✨ 功能特性

### 📊 数据提取
- **表格提取**：智能识别并提取网页表格数据
- **列表提取**：支持卡片列表、UL/OL 列表等多种布局
- **详情页提取**：完整提取商品详情、表单数据、描述列表等
- **电商字段映射**：自动识别标题、价格、评分、销量、库存等电商字段

### 🎯 选择方式
- **自动识别模式**：一键智能识别页面结构和字段
- **手动选择模式**：鼠标悬停高亮，点击选择目标元素
- **字段过滤**：自定义选择需要输出的字段

### 📦 数据输出
- **JSON 格式**：结构化数据输出
- **CSV 格式**：支持表格化数据导出
- **复制到剪贴板**：快速复制数据
- **文件下载**：支持 JSON/CSV 文件下载

### 🔄 批量采集
- **自动分页**：智能识别分页按钮，自动爬取下一页
- **深度控制**：可配置最大爬取页数（0-20页）
- **进度展示**：实时显示采集进度和统计数据
- **历史记录**：记录每一页的采集结果

### 📋 设置面板
- **Robots 协议**：自动检查并遵守网站爬取规则
- **请求间隔**：可调节请求间隔（默认 4 秒，建议 3-5 秒）
- **爬取深度**：设置批量采集的最大页数

## 🚀 快速开始

### 安装步骤

1. 打开 Chrome 浏览器，访问 `chrome://extensions/`
2. 开启右上角的「开发者模式」
3. 点击「加载已解压的扩展程序」
4. 选择本项目目录（`g:\test1`）

### 使用方法

1. 在任意网页点击浏览器工具栏中的插件图标
2. 插件自动识别页面类型（列表页/详情页）
3. 在「字段选择」标签页选择需要的字段
4. 在「数据预览」标签页查看提取结果
5. 点击「复制」或「下载」按钮获取数据

### 批量采集

1. 切换到「批量采集」标签页
2. 设置请求间隔和爬取深度（建议保持默认值）
3. 点击「开始采集」按钮
4. 插件自动遍历分页，采集所有数据
5. 采集完成后自动下载汇总数据

## 📁 项目结构

```
.
├── manifest.json          # Chrome 扩展配置文件（Manifest V3）
├── content.js             # 内容脚本，负责页面数据提取
├── popup.html             # 插件弹出窗口 UI
├── popup.js               # 弹出窗口逻辑，处理用户交互
├── background.js          # 后台服务工作线程
├── COMPARISON.md          # 竞品对比分析文档
├── test.html              # 测试页面（含表格、卡片、详情页）
└── icons/                 # 插件图标（16x16, 32x32, 48x48, 128x128）
    ├── icon16.png
    ├── icon32.png
    ├── icon48.png
    └── icon128.png
```

## 📊 竞品对比

| 功能 | Tablify | Web Scraper | Instant Data Scraper | 迷你派采集器 | 本插件 |
|------|---------|-------------|----------------------|--------------|--------|
| 表格提取 | ⭐⭐⭐⭐⭐ | ⭐⭐⭐ | ⭐⭐⭐⭐ | ⭐⭐⭐ | ⭐⭐⭐⭐ |
| 列表提取 | ⭐⭐ | ⭐⭐⭐⭐⭐ | ⭐⭐⭐⭐⭐ | ⭐⭐⭐⭐⭐ | ⭐⭐⭐⭐⭐ |
| 卡片提取 | ⭐⭐ | ⭐⭐⭐⭐ | ⭐⭐⭐⭐ | ⭐⭐⭐⭐⭐ | ⭐⭐⭐⭐⭐ |
| 详情页提取 | ⭐⭐ | ⭐⭐⭐⭐ | ⭐⭐⭐⭐ | ⭐⭐⭐⭐⭐ | ⭐⭐⭐⭐⭐ |
| 电商字段映射 | ⭐⭐ | ⭐⭐⭐ | ⭐⭐⭐ | ⭐⭐⭐⭐⭐ | ⭐⭐⭐⭐⭐ |
| Robots 协议检查 | ⭐⭐ | ⭐⭐⭐ | ⭐⭐ | ⭐⭐⭐ | ⭐⭐⭐⭐⭐ |
| 请求间隔控制 | ⭐⭐ | ⭐⭐⭐⭐ | ⭐⭐⭐ | ⭐⭐⭐⭐ | ⭐⭐⭐⭐⭐ |
| JSON 输出 | ⭐⭐⭐⭐ | ⭐⭐⭐⭐⭐ | ⭐⭐⭐⭐ | ⭐⭐⭐⭐ | ⭐⭐⭐⭐⭐ |
| CSV 输出 | ⭐⭐⭐⭐⭐ | ⭐⭐⭐⭐⭐ | ⭐⭐⭐⭐ | ⭐⭐⭐⭐ | ⭐⭐⭐⭐⭐ |

## 📦 打包发布

### 使用打包脚本（推荐）

项目提供了 `pack.py` 脚本，可自动创建干净的发布包：

```bash
# 创建 ZIP 包（用于 Chrome 网上应用店）
python pack.py

# 创建 CRX 包（用于自托管分发）
python pack.py --crx

# 使用已有私钥创建 CRX 包（用于版本更新）
python pack.py --crx --key=page-data-scraper.pem
```

打包脚本会自动：
- 只包含运行时必需文件（manifest.json, content.js, popup.html, popup.js, background.js, icons/）
- 排除开发文件（test.html, COMPARISON.md, README.md, .git, __pycache__ 等）
- 在 `releases/` 目录生成带版本号和时间戳的压缩包

### 手动打包

#### 方式一：创建 ZIP 包（推荐用于 Chrome 网上应用店）

1. 在项目目录中，手动选择以下文件和文件夹：
   - `manifest.json`
   - `content.js`
   - `popup.html`
   - `popup.js`
   - `background.js`
   - `icons/`（整个文件夹）
2. 将选中的文件压缩为 ZIP 文件
3. 确保 ZIP 文件根目录直接包含这些文件（不要嵌套在子文件夹中）

#### 方式二：使用 Chrome 打包 CRX（用于自托管）

1. 打开 Chrome 浏览器，访问 `chrome://extensions/`
2. 确保已加载本插件（加载已解压的扩展程序）
3. 点击插件卡片右下角的「打包扩展程序」按钮
4. 在弹出的对话框中：
   - 扩展程序根目录：选择本项目目录
   - 私有密钥文件（可选）：首次打包可不填
5. 点击「打包扩展程序」按钮
6. 打包完成后，会生成两个文件：
   - `页面数据采集器.crx`：扩展程序安装包（用于自托管分发）
   - `页面数据采集器.pem`：私钥文件（**务必妥善保存！** 用于后续更新）

### 发布到 Chrome 网上应用店

1. 访问 [Chrome 开发者控制台](https://chrome.google.com/webstore/devconsole)
2. 登录 Google 账号
3. 点击「添加新项」按钮
4. **上传 ZIP 文件**（不是 `.crx` 文件！）
5. 填写扩展程序信息（名称、描述、截图、分类等）
6. 提交审核，等待发布

### 版本更新流程

1. 更新 `manifest.json` 中的 `version` 字段（遵循语义化版本）
2. 如果已有 `.pem` 私钥文件，使用它重新打包：
   ```bash
   python pack.py --crx --key=your-extension.pem
   ```
3. 在 Chrome 开发者控制台上传新的 ZIP 文件
4. 提交更新审核

### 重要提醒

- **私钥文件（.pem）**：首次打包生成后，请务必妥善保存。如果丢失，将无法发布更新到同一扩展 ID。
- **不要将私钥文件提交到版本控制**：`.gitignore` 已排除 `.pem` 文件，请确保不泄露。
- **发布包大小限制**：Chrome 网上应用店要求扩展包不超过 10MB。
- **图标要求**：必须提供 16x16, 32x32, 48x48, 128x128 四种尺寸的图标。

## 🔒 安全合规

### Robots 协议遵守
- 插件默认开启 Robots 协议检查
- 采集前自动获取网站 `robots.txt` 文件
- 解析 `Disallow` 规则，判断当前页面是否允许爬取
- 若页面被禁止，会弹出警告提示用户

### 请求频率控制
- 默认请求间隔：4 秒/次
- 建议范围：3-5 秒/次
- 可通过设置面板自定义调整
- 避免对目标网站造成压力

### 数据隐私
- 所有数据仅在本地处理，不上传任何服务器
- 不存储用户的浏览历史或采集数据
- 完全开源，可审计代码

## 📝 技术实现

### 核心技术栈
- **Manifest V3**：Chrome 扩展最新标准
- **Content Script**：页面数据提取核心
- **MutationObserver**：SPA 页面动态内容监测
- **Chrome Storage API**：设置持久化存储

### 数据提取算法
- **页面类型识别**：通过检测表格、列表、卡片布局判断页面类型
- **电商字段映射**：基于关键词匹配和模式识别自动映射字段
- **分页识别**：支持多种分页模式（按钮点击、URL 参数、页码列表）

## 🐛 常见问题

**Q: 插件无法提取数据？**
A: 请尝试刷新页面后重新提取，或切换到手动选择模式。

**Q: 批量采集不工作？**
A: 请检查设置面板中的请求间隔和爬取深度设置，确保网络连接正常。

**Q: 被网站封禁？**
A: 请增大请求间隔（建议 5-10 秒），并确保遵守网站 Robots 协议。

## 📄 许可证

MIT License

## 🤝 贡献

欢迎提交 Issue 和 Pull Request！

## 📧 联系方式

如有问题或建议，请在 GitHub 仓库提交 Issue。