☰

在 Chrome 中截取大型网页截图

tag-icon • tag-icon google-chrome google-chrome-extensions screenshot webpage
在 Chrome 中截取大型网页截图

网页非常大（几MB）。我试过这些扩展，但都失败了：

  • 屏幕截图（由 Google 提供）- 我打开一个新标签，里面没有图片
  • Pixlr 抓取器- 按下保存后出现“500”请求错误
  • 捕获网页截图 - Fireshot- 告诉我网页太大，它将被保存到 RAM，之后我收到一个错误:(Insufficient video memory: You need at least -2365 MB of RAM这太荒谬了，我有 1 GB）
  • 网页和网络摄像头截图- 我没有看到图像
  • 精彩截图 - 截取并注释- 它显示capturing...，完成后会打开一个带有一些按钮的新选项卡。当我按“完成”时，它显示preparing your image...永远。

您知道任何真正有用的网站屏幕截图工具吗？

答案1

从 Chrome v59 开始，可以实现此目的：

开发者博客中的公告

视频教程

步骤摘要（如果您喜欢文字）：

  1. 打开开发者工具
  2. 切换设备工具栏
  3. 在设备工具栏中设置所需的分辨率
  4. 在设备工具栏中选择“更多选项”溢出菜单
  5. 选择截取屏幕截图或截取全尺寸屏幕截图
  6. 屏幕截图将保存到您的下载文件夹

答案2

如果你使用 Chrome，我会使用可爱队长它将 webkit 的渲染捕获到图像中。

CutyCapt 是一款小型跨平台命令行实用程序，用于将 WebKit 对网页的渲染捕获为各种矢量和位图格式，包括 SVG、PDF、PS、PNG、JPEG、TIFF、GIF 和 BMP。请参阅 IECapt 了解基于 Internet Explorer 的类似工具。

答案3

我最终在 Windows 中使用了 PhantomJS，我使用了……

截图.js

var page = require('webpage').create();

page.open('http://gigantic-web-page.com', function () {
    page.render('test.png');
    phantom.exit();
});

将其转储到 phantomjs 文件夹中，然后再转储一个文件 screenshot.cmd

phantomjs --ignore-ssl-errors=yes --cookies-file=cookies.txt --web-security=no screenshot.js

将这两个文件放在 phantomjs 文件夹中，运行 screenshot.cmd...我刚刚生成了一个巨大页面的 40mb png 文件，虽然花了一段时间，但最终还是输出了它！

答案4

在 Chrome 中截取大型网页截图？网页非常大（几 MB）。我尝试了屏幕截图（由 Google 提供）- 我得到了一个没有图像的新标签页。

这是因为它使用的画布元素存在问题。忽略它并保存文件，然后打开文件；应该没问题。

不久前，我也遇到了空标签问题（使用捕获整个页面函数），出于好奇，我[Save]还是点击了按钮。当我打开生成的文件时（出于好奇，以为它要么是空白的，要么是 0x0），我惊讶地发现图像不仅在那里，而且正确的！ 好的。

当然，这意味着在保存之前您将无法使用扩展的（有限的）图像编辑工具，但那又怎样？您可以同样轻松地使用 MSPaint 或其他任何程序（我总是不加修改地保存它，然后修改副本）。

相关内容