CN 网页截图

要解决什么问题

工程师在留档、做视觉对比或检查移动端布局时，往往需要「页面真正渲染完」之后的像素级快照，而不是浏览器里随手截屏。动态页面、懒加载和长滚动页会让普通截图漏掉内容或截到空白骨架。

技能如何工作

本技能基于 Playwright 驱动 Chromium，对目标 URL 发起访问并在可控视口下生成 PNG。

• 全页截图：默认滚动拼接整页，超出首屏的内容一并捕获
• 视口截图：配合 --partial 只保留当前可见区域
• 设备视口：--viewport mobile（375×667）或 tablet（768×1024），桌面默认为 1280×720
• 渲染等待：--wait 在加载后额外等待毫秒数，适合 JS 渲染后再截
• 输出与 URL：可指定 --output 路径；URL 无协议时自动补全 https://

典型流程：传入 URL → 选择视口与是否全页 → 设置等待时间 → 得到 PNG 文件。

适用边界与注意

• 仅 Chromium，需系统已安装对应浏览器
• 登录态页面（Cookie/Token）无法直接截，需配合浏览器类技能
• 超长页面（>10000px）全页截图可能较慢
• 等待建议 1000–3000ms：过短易截到未渲染内容，过长则浪费