webpage-screenshot

📸 一键网页快照与截图工具

基于 Playwright 的网页截图方案,可将任意 URL 保存为高清 PNG,适用于留档、分享与可视化展示,文档透明无隐藏风险。

收藏
6.5k
安装
2.4k
版本
v1.0.0
CLS 安全性认证2026-06-04
点击查看完整报告 >

使用说明

核心用法

webpage-screenshot 提供两种互补的网页捕获方案。方式一(推荐)通过项目内 TypeScript 脚本执行截图,用户需在项目根目录运行 npm run screenshot -- <URL> [输出路径],默认生成包含滚动区域的整页 PNG 文件(视口 1280px),支持自定义输出路径。方式二适用于快速查看场景,通过 Cursor 的 browser MCP 调用 browser_navigate 和 browser_snapshot 获取页面结构快照,不生成实体文件但支持交互查看。两种方式均需预先执行 npm install 并安装 Playwright 浏览器(npx playwright install chromium)。

显著优点

该 Skill 的最大优势在于整页截图能力,可自动捕获视口外内容,适用于长页面存档;输出灵活性允许用户指定文件路径,便于集成到自动化工作流;双模式设计兼顾了文件归档需求(脚本方式)与快速预览需求(MCP 方式)。此外,文档结构清晰,明确标注了前置条件与依赖要求,降低了使用门槛。作为纯文档型资产,其功能描述透明可查,无隐藏逻辑。

潜在局限

主要局限性在于环境依赖较重,需完整的 Node.js 环境和 Playwright 浏览器安装,对临时使用场景不够轻量;T3 来源等级意味着由个人开发者维护,长期更新与支持存在不确定性;功能边界依赖外部脚本,SKILL.md 仅提供调用说明,实际截图逻辑由项目内脚本实现,用户需自行确保项目代码安全;无实时渲染反馈,脚本方式执行后仅输出文件,无过程预览。

目标群体

特别适合前端开发者进行页面视觉回归测试、产品经理制作需求文档配图、运营人员保存活动页快照、内容创作者采集网页素材,以及QA 工程师记录 Bug 现场。对于需要定期监控网页变化或建立可视化文档库的技术团队尤为实用。

使用风险

依赖安全风险:实际功能依赖项目内的 Playwright 脚本,需确保 package.json 中的依赖来自可信源,避免供应链攻击。隐私泄露风险:截图会访问目标 URL,若用于捕获含敏感信息的内部页面(如后台管理系统、含个人数据的页面),截图文件可能残留本地或意外分享。性能风险:Playwright 启动浏览器进程消耗内存较高(通常 100-300MB),频繁截图或并发执行可能影响系统性能。网络风险:访问恶意网站可能导致浏览器环境受到攻击,建议在隔离环境中使用。

安全解读

核心用法

webpage-screenshot 是一款纯文档型 Skill,本身不含可执行代码,仅提供调用本地截图工具的指南。用户需预先在项目根目录执行 npm run screenshot -- <URL> [输出路径],依托 Playwright + Chromium 浏览器引擎捕获完整网页渲染结果(含滚动区域,默认视口 1280px)。若仅需临时查看而非保存文件,可转用 Cursor 内置 MCP 浏览器的 browser_navigate + browser_snapshot 组合。

显著优点

  • 零代码风险:T-MD(Pure Markdown)分类,无可执行脚本、无第三方依赖声明,安全扫描六维度均达 95+ 分。
  • 输出完整:整页滚动截图,非仅首屏,满足归档与审计需求。
  • 双模式灵活:既支持本地文件落盘(脚本方式),也支持对话内快速预览(MCP 浏览器)。

潜在缺点与局限

  • 前置依赖重:需 Node.js 环境、Playwright 及 Chromium 二进制(约 150MB+),首次安装耗时。
  • 无云渲染:完全本地执行,无法利用云端浏览器集群,大规模批量截图时资源占用高。
  • T3 来源:维护者为社区个人开发者,虽代码透明,但长期维护与版本更新节奏存在不确定性。

适合人群

前端开发者、测试工程师、内容运营及需要定期生成网页快照的合规/法务团队。

常规风险

  • 输入 URL 未校验:命令行直接透传 URL,若用户粘贴恶意链接,Playwright 会真实访问,需自行确保目标站点可信。
  • 本地浏览器漏洞:Chromium 安全更新依赖用户手动维护 Playwright 版本。

webpage-screenshot 内容

手动下载zip · 1.2 kB
SKILL.mdtext/markdown
请选择文件