用途:当任务需要把本地 .html 文件通过远端 html2image API 渲染为图片时使用该技能,流程包括读取 HTML、执行渲染并保存图片到本地。
主要能力:内置脚本以 UTF-8 读取 HTML 文件,调用 POST https://html2image.hanfangyuan.cn/api/html2image,解码返回的 image_base64 并写入本地磁盘;支持按元素 id 截图,可选 png、jpeg,可调设备像素比、视口尺寸、截图前等待时间和元素边距。
使用方式:如有需要先查看 references/html-to-image-api.md 的接口约定,再运行 scripts/render-html-to-image.ts,传入输入与输出路径。示例:npx -y tsx skills/html-to-image-render/scripts/render-html-to-image.ts --input ./demo/card.html --output ./out/card.png --element-id card --image-type png。必选参数为 --input、--output;可选参数有 --element-id(原始 id,不带 #)、--image-type、--device-scale-factor、--viewport-width / --viewport-height、--render-wait-ms、--element-padding(默认 0)。运行后确认图片已生成到目标位置。
适用场景与限制:适合把本地 HTML 卡片或页面渲染为图片。运行环境需本机有可用的 npx,首次运行通常会下载 tsx;HTML 中的图片须使用公网可访问链接,不支持本地图片路径;输出扩展名应与 --image-type 一致;截图区域须能容纳目标 HTML,卡片宽高大于默认视口时应显式调大 --viewport-width、--viewport-height,避免裁切;接口返回 400 通常是 element_id 对应元素不存在,422 通常是参数范围不合法。仅在默认结果不满足需求时再调整视口和等待时间。费用、平台要求等未提供。