mcpField
W
website-screenshot

website-screenshot

github.com/html2png生产力1071 次安装39 周前更新
代码仓库

关于 website-screenshot

website-screenshot 是面向需要网页视觉采集的工作流的技能,通过 html2png.dev 将实时网站转换为图像或 PDF。它支持整页捕获及视口、色彩方案等参数调整。

主要功能

  1. 01捕获实时网站截图
  2. 02支持整页捕获
  3. 03输出 PNG、WebP 或 PDF
  4. 04调整视口与设备缩放
  5. 05设置延迟及色彩方案

适用场景

  1. 01生成网页整页截图
  2. 02采集移动视口画面
  3. 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}'

参数

参数类型默认值描述
urlstring必填要捕获的网站 URL
widthint1280视口宽度
heightint800视口高度
fullPageboolfalse捕获整个可滚动页面
formatstringpngpng、webp、pdf
deviceScaleFactorfloat2Retina 缩放(1-4)
delayint0捕获前等待的毫秒数
omitBackgroundboolfalse背景透明
colorSchemestring-浅色或深色
userAgentstring-自定义用户代理

响应

{
  "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