完整网页截图不用再手动拼图：免费开源Chrome扩展实测整页捕获

【免费下载链接】full-page-screen-capture-chrome-extensionOne-click full page screen captures in Google Chrome项目地址: https://gitcode.com/gh_mirrors/fu/full-page-screen-capture-chrome-extension

为了存下一整页长网页，我试过滚动截图、找拼接工具、甚至把页面打印成PDF再转图片，直到遇上开源小工具 full-page-screen-capture-chrome-extension。这个Chrome扩展能把当前页面从头到尾完整捕获，自动拼成一张高清长图，全程只需点一下图标。下文就从我的一次真实翻车经历说起，带你完整走一遍它的安装、使用与原理。

01 一次被长截图逼疯的经历

前阵子我需要把某购物平台一整页商品详情（大概二十多屏）存档归档。当时的第一反应是：截图嘛，谁不会？结果我打开系统自带截图，滚一屏、截一屏，截了六张图，然后打开图片编辑器手动拼接。半小时后，我盯着错位的文字、重叠的区块和歪掉的导航栏，差点想把电脑合上。

最气人的是，这种"长页面存档"的需求我几乎每周都会遇到：运营要留底、编辑要存素材、产品要看完整方案。靠手动拼图，时间和耐心都被消耗在这种机械劳动上。

后来在开源社区翻到一个叫full-page-screen-capture-chrome-extension的Chrome扩展，从2012年发布至今持续维护。同样是截图，体验完全不同：

02 三分钟完成安装的完整步骤

这个扩展不用付费、不用注册，整个安装过程就三步：

1. 打开终端，把项目克隆到本地：

git clone https://gitcode.com/gh_mirrors/fu/full-page-screen-capture-chrome-extension

2. 在Chrome地址栏输入chrome://extensions/，打开右上角的"开发者模式"开关，点击"加载已解压的扩展程序"，选择刚才克隆出来的文件夹。

3. 加载完成后，浏览器工具栏会多出一个蓝色相机图标，这就表示它已经就绪。

小贴士：默认快捷键是Alt+Shift+P，在扩展管理页面的"键盘快捷键"里也可以改成你顺手的组合键。

03 点击图标后的30秒，它悄悄做了什么

第一次使用时，我很好奇它到底怎么做到的。点下图标后，弹出的窗口会显示一根进度条，背景页面开始自动滚动，每滚到一处就"咔"地拍一张，然后继续往下滚。整个过程就像一台打印机在逐行走纸，你不用碰鼠标，静静等着就行。

进度条走完后，新标签页会自动打开，一张从页面顶部一直延伸到页面底部的完整长图已经躺在那里了。中间经历的动作可以概括为四步：测量页面总高度 → 把长页面切成多个可见片段 → 逐个滚动并捕获 → 按坐标无缝拼回一张图。

实用提醒：截图进行中尽量别移动鼠标或切走标签页，给它一个安静的环境，出图又快又稳。

04 拿到手的成品长什么样

下面这张图就是它生成的成品——一个游戏页面的整页截图，顶部标题、中间内容、底部评论区全部按原始顺序拼接在一起，没有任何重复或缺口：

拿到图之后，你可以：

• 右键选择"图片另存为"，把长图存到本地；
• 直接拖拽到桌面或聊天窗口；
• 复制图片粘贴到文档、邮件里。

它还自带一套智能命名规则：screencapture-域名-时间戳.png。比如screencapture-www-example-com-1695000000000.png，存档多了也不会乱。

05 拆开看原理：像打印机逐行走纸

为什么它能拼得严丝合缝？用生活里的例子来解释：想象一台打印机，纸张太长放不下，于是它先把纸的前半段推进去印一遍，再往后推印下一段，最后把印好的所有段落按顺序贴回同一张纸上。

• 分段捕获：扩展先算出页面总高度和视窗高度，把页面切成若干个"屏幕大小"的片段，然后挨个scrollTo到位、拍照。
• 坐标拼接：每一帧照片都带着自己的坐标信息，代码用画布（canvas）把每张照片按坐标"贴"到对应位置，就像铺瓷砖一样严丝合缝。
• 缩放容错：遇到页面缩放或设备像素比不同导致照片尺寸偏差时，会自动按比例修正坐标，避免拼接错位。
• 超长页面兜底：Chrome 对单张图片有尺寸上限，页面太长时它会主动拆成几张图，分别在新标签页打开，而不是硬拼导致崩溃。
• 善后恢复：截图结束后，自动把页面滚动位置和样式恢复原样，不会在你页面上留下任何痕迹。
• 动态内容等待：每滚动一段都会预留短暂延迟，等图片、懒加载内容渲染完成再拍照，所以截图里基本不会出现"灰块"。

06 五个文件撑起的整页截图

整个项目轻量到让人意外，核心就五个文件，一个比一个精简：

权限方面，它只申请了activeTab（访问当前活动标签页）、storage（存储设置）和unlimitedStorage（存放较大的截图文件），全部在本地完成，不向任何服务器上传数据。

07 三个真正用得上它的实战案例

案例一：电商运营的详情页存档。每次活动结束后，把商品详情页、活动落地页整页截图归档，作为日后核对价格、文案、上架信息的凭证。以前靠人肉拼图，现在点一下图标，几秒钟搞定一个页面。

案例二：自媒体创作者做长图素材。很多平台支持"长图"形式的内容，把网页文章、数据报告截图成一张竖长图，直接用于配图或转发。生成的文件自带域名和时间戳，管理素材库时一目了然。

案例三：产品经理留底需求文档。在线协作工具里的原型页、流程图页经常很长，把每一版设计整页截图留存，版本对比时不用再翻回旧系统，一张图就是一份快照。

08 常见疑问与避坑指南

Q：在哪些页面上它会失灵？A：受Chrome安全策略限制，Chrome应用商店等少数特殊页面无法注入脚本，会提示"无法在此类型URL上运行"。换一个普通网页即可。

Q：网页特别长，会不会截到一半崩溃？A：不会。它会在尺寸到达上限前自动把成品拆成多张图，每张图单独打开，虽然要多存几个文件，但至少不会前功尽弃。

Q：截图之后，我原来的页面会被弄乱吗？A：不会。无论滚动位置还是页面样式，都会在截图结束后自动恢复。截图过程中页面暂时滚动是正常现象，属工作流程的一部分。

Q：它能截到登录后才显示的内容吗？A：能。只要你已经登录，它捕获的就是你当前看到的样子，包括个人中心、后台面板这类需要权限的页面。

Q：截图的时候手滑动了鼠标怎么办？A：别担心，正常情况不会导致失败，只是个别动态元素可能出现偏移。如果对效果不满意，刷新后重新截一次就行。

Q：遇到报错如何排查？A：常见的三个排查方向：先刷新页面重试（多数是脚本执行抖动）；确认页面JavaScript已启用；如果持续报错，记下网址和Chrome版本反馈给项目维护者，通常很快能得到答复。

最后：把"长截图"这件事彻底交出去

回想那半小时的手动拼图，其实是被陈旧习惯拖累的效率。这个开源扩展把"完整网页截图"压缩成了一个动作——点一下图标，等进度条走完。它免费、开源、权限克制，从下载到上手用不了十分钟，却能省下你每个月成把的截图时间。

现在就可以动手：克隆仓库 → 加载到Chrome → 打开一个长网页 → 点一下蓝色相机图标。三十秒后，你会拿到一张横跨整页的高清长图，然后明白为什么我开头会说那句话——好用的工具，应该让你忘记工具本身的存在。

【免费下载链接】full-page-screen-capture-chrome-extensionOne-click full page screen captures in Google Chrome项目地址: https://gitcode.com/gh_mirrors/fu/full-page-screen-capture-chrome-extension