关于 website-screenshot
website-screenshot 是面向需要网页视觉采集的工作流的技能,通过 html2png.dev 将实时网站转换为图像或 PDF。它支持整页捕获及视口、色彩方案等参数调整。
主要功能
- 01捕获实时网站截图
- 02支持整页捕获
- 03输出 PNG、WebP 或 PDF
- 04调整视口与设备缩放
- 05设置延迟及色彩方案
适用场景
- 01生成网页整页截图
- 02采集移动视口画面
- 03导出网页为 PDF
安装
复制下面的命令,在终端中运行。
$
npx skills add https:/ / github.com/ html2png/ skills --skill website-screenshot安装后在 Claude Code 中输入/website-screenshot确认已加载。
详细介绍
网站截图 API
通过 html2png.dev 捕获任意在线网站的截图。
端点
POST https://html2png.dev/api/screenshot
请求
curl -X POST "https://html2png.dev/api/screenshot" \
-H "Content-Type: application/json" \
-d '{"url": "https://example.com", "width": 1280, "fullPage": true}'
参数
| 参数 | 类型 | 默认值 | 描述 |
|---|---|---|---|
url | string | 必填 | 要捕获的网站 URL |
width | int | 1280 | 视口宽度 |
height | int | 800 | 视口高度 |
fullPage | bool | false | 捕获整个可滚动页面 |
format | string | png | png、webp、pdf |
deviceScaleFactor | float | 2 | Retina 缩放(1-4) |
delay | int | 0 | 捕获前等待的毫秒数 |
omitBackground | bool | false | 背景透明 |
colorScheme | string | - | 浅色或深色 |
userAgent | string | - | 自定义用户代理 |
响应
{
"success": true,
"url": "https://html2png.dev/api/blob/screenshot-abc.png",
"format": "png",
"timestamp": "2025-01-27T10:30:00.000Z"
}
示例
基本截图
curl -X POST "https://html2png.dev/api/screenshot" \
-H "Content-Type: application/json" \
-d '{"url": "https://github.com"}'
整页捕获
curl -X POST "https://html2png.dev/api/screenshot" \
-H "Content-Type: application/json" \
-d '{"url": "https://example.com", "fullPage": true, "delay": 2000}'
移动端视口
curl -X POST "https://html2png.dev/api/screenshot" \
-H "Content-Type: application/json" \
-d '{"url": "https://example.com", "width": 375, "height": 812, "deviceScaleFactor": 3}'
导出 PDF
curl -X POST "https://html2png.dev/api/screenshot" \
-H "Content-Type: application/json" \
-d '{"url": "https://example.com", "format": "pdf", "fullPage": true}'
深色模式
curl -X POST "https://html2png.dev/api/screenshot" \
-H "Content-Type: application/json" \
-d '{"url": "https://example.com", "colorScheme": "dark"}'
JavaScript 示例
const response = await fetch("https://html2png.dev/api/screenshot", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({
url: "https://example.com",
width: 1280,
fullPage: true,
delay: 1000,
}),
});
const data = await response.json();
console.log(data.url);
提示
- 对于 JavaScript 较多或包含动画的网站,请使用
delay fullPage会捕获整个可滚动内容- 使用
deviceScaleFactor=2或更高值可获得清晰的文本 - 不缓存——每个请求都会捕获最新内容
速率限制
每个 IP 每小时 50 次请求。
评论
支持 Markdown