一键生成网页全页截图

基于 Playwright 的网页全页截图工具，支持本地保存 PNG 文件，适合网页留档与可视化备份。

基本信息

• 技能名称?Webpage Screenshot
• 中文名称?一键生成网页全页截图
• 作者?malenconiaprincep
• 分类?专业技能
• 版本?1.0.0
• 标签?web-scraping, automation, playwright, screenshot, archive, visual-testing

使用方法

使用说明
核心用法
webpage-screenshot 提供两种截图方式：
推荐方式 ：运行项目内置 TypeScript 脚本，通过命令行生成 PNG 文件：
npm run screenshot -- [输出路径] 默认输出 screenshot.png ，支持自定义路径
前置依赖： npm install + npx playwright install chromium
替代方式 ：使用 MCP 浏览器的 browser_navigate + browser_snapshot 组合，适合对话内快速查看而不保存文件。
显著优点
整页捕获 ：自动滚动截取完整网页（非仅首屏）
标准化输出 ：1280px 视口宽度，PNG 格式通用兼容
本地化存储 ：文件直接落盘，便于后续处理与归档
潜在局限
依赖 Node.js 环境及 Playwright 浏览器安装，非零配置
纯静态截图，不支持交互后状态捕获
未提及反爬虫/验证码/动态渲染（如 SPA 懒加载）的处理能力
适合人群
前端开发者、测试工程师、内容运营人员——需批量网页存档、竞品监控或设计验收场景。
常规风险
截图可能包含敏感页面内容，需妥善管理本地文件
高频抓取需遵守目标网站的 robots.txt 及使用条款