在命令行上使用Firefox进行全页面截图

Question

在命令行上使用Firefox进行全页面截图

238

我在VPS上使用Xvfb运行Firefox。我想要做的是对页面进行全屏截图。

我可以使用以下命令将Firefox重定向到特定页面：

firefox http://google.com

使用 ImageMagick 在 X 中进行截屏

import root -window output.jpg

问题是，大多数页面需要滚动，我无法预先知道其高度。

另一种方法是选择一个非常大的高度（如4000px），然后处理图像并删除无用部分。但这是不必要的处理。

我找到了许多Firefox插件，但我正在寻找可以使用Shell命令行编程的解决方案。

编辑：最终我自己编写了FireFox扩展程序来实现此功能。

- Omar Abid

1

我看过一些用于截屏的 Webkit 命令行工具，但我不记得它们的名称了。 - Rufo El Magufo

6个回答

143

更新2018-07-23

正如评论中刚指出的那样，这个问题是关于如何从命令行获取屏幕截图的。抱歉，我刚才忽略了这一点。所以这里是正确的答案：

自Firefox 57起，您可以像这样在无头模式下创建屏幕截图：

firefox -screenshot https://developer.mozilla.com

查看文档以获取更多信息。

更新于2017-06-15

自 Firefox 55 起，Firefox 截图成为了一种更灵活的替代方案。自 Firefox 57 起，截图还可以捕获整个页面。

原始回答

自 Firefox 32 以来，在开发者工具（F12）中也有一个完整页面截图按钮。如果未启用，请转到开发者工具设置（齿轮按钮）并在“可用工具箱按钮”部分选择“拍摄整个页面截图”。

developer tools toolbar 来源：developer.mozilla.org

默认情况下，截图将保存在下载目录中。这与工具栏中的screenshot --fullpage类似。

- Mouagip

7

如果火狐浏览器中的Firebug开启快捷键是F12的话，你仍然可以通过按Ctrl+Shift+K 或 Ctrl+Shift+I打开开发者工具。仅供参考，以防万一有人以前没有使用过它们。 - Kir Kanos

这些键盘快捷键在 Mac 上不起作用。请使用“工具”>“Web 开发人员”>“切换工具”。是的，默认情况下，屏幕截图按钮被禁用。单击设置图标以启用。 - Snowcrash

在 Mac 上，您可以使用 cmd+alt+i 打开开发者工具。 - null

Firefox截图将所拍摄的截图上传到Mozilla的服务器。他们没有提前让我注意到这一点，这一点并不明显。幸运的是，在我的情况下，图片并不太敏感，尽管它是内部的。请注意。 - Hammer Bro.

@HammerBro。如果您不希望截图上传到Mozilla服务器上，您可以点击“下载”。但我同意默认行为的影响可能对大多数用户来说并不明显。 - Mouagip

9

我最终编写了一个自定义解决方案（Firefox扩展程序）来实现这个功能。我认为在我开发它的时候，enreas提到的命令行并不存在。

该Firefox扩展名为CmdShots，可以在此处找到。如果你需要更精细地控制截屏过程（或者想要进行一些HTML / JS修改和图像处理），那么这是一个不错的选择。

您可以使用它，并滥用它。我决定将其保留未经许可，因此您可以自由地根据自己的需求使用它。

- Omar Abid

20

哦， "未经许可" 的意思并不是你不允许任何使用，它实际上意味着你不授权任何使用。而在那个句子中，你也说可以随意使用、滥用和玩弄它，这显然是不正确的。或许你需要像 CC0 这样的东西？ - SamB

对于那些“未经许可”的事情，我更喜欢这个：http://www.wtfpl.net/ 它清楚地说明了什么是允许的，没有法律上的繁琐。 - kap

1

@SamB 我偶然看到了你的评论。是的，我知道已经过去3年了。问题在于，如果我写一个许可证，那么事情就会变得更加复杂。NOLICENSE方法就是简单粗暴。 - Omar Abid

3

请大家不要使用自定义许可证。我知道有些人想通过编写自己的许可证来避免法律纠纷，但结果却相反，给人们带来了法律上的麻烦，因为他们需要弄清楚自定义许可证的实际含义。请参考 choosealicense.com。 - Flimm

@SamB - 虽然“未经许可”并不是一个明确的“官方许可证”，但“The Unlicense”实际上是一种许可证，并且似乎非常接近OP描述他对代码使用意图的内容。请参见：https://choosealicense.com/licenses/unlicense/ - Will Ediger

8

我认为您需要的是一种工具，可以将您在浏览器中打开的完整页面保存为png文件。很可能您正在寻找像commandlineprint2这样的实用程序。

安装扩展后，您只需要输入以下命令即可：

firefox -print http://google.com -printfile ~/foo.png

- Nehal J Wani

3

Firefox Screenshots 是 Firefox 新推出的一个工具。它不是开发者工具，而是面向浏览器终端用户的工具。

要截取屏幕截图，请在页面上的空白处右键单击，然后选择“取得屏幕截图”。如果您点击“保存完整页面”，它将为您滚动并保存整个页面。

_{(来源：mozilla.net)}

- Flimm

4

从问题中得知：“我找到了许多Firefox插件，但我正在寻找一种可以使用Shell命令行编程的解决方案。” - Quentin

@Quentin，这不是一个插件，而是直接集成在最新的Firefox版本中。 - Veve

@Veve — 强调“使用Shell命令行” - Quentin

我使用的是Firefox 88.0版本，但在右键单击时没有看到“截图”选项。我认为这是因为默认情况下，在about:config中的extensions.screenshots.disabled属性被设置为true。需要将其设置为false才能使该方法起作用。否则，您需要添加截图选项。（更改这些属性时无需重新启动） - TylerH

@TylerH 你需要右键单击一个空白区域。我已经编辑过我的答案了。 - Flimm

@Flimm 我试过了；我在多个不同的网站上点击了很多次。问题出在 about:config 中的属性上。当我将其设置为 true 时，选项就出现在我的上下文菜单中了。 - TylerH

1

你可以使用Selenium和Firefox的WebDriver。

import selenium.webdriver
import selenium.common

options = selenium.webdriver.firefox.options.Options()
# options.headless = True
with selenium.webdriver.Firefox(options=options) as driver:
    driver.get('http://google.com')
    time.sleep(2)
    root=driver.find_element_by_tag_name('html')
    root.screenshot('whole page screenshot.png')

- Gqqnbig

脚本中缺少了“import time”，但是无论如何它都能正常工作，谢谢！ - ciampix

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- enreas · Accepted Answer

Firefox版本60中移除了开发者工具栏GCLI和Shift+F2快捷键。在60或更高版本中进行截屏的方法如下：

按下Ctrl+Shift+K打开开发者控制台（macOS上为⌥ Option+⌘ Command+K）
输入:screenshot 或 :screenshot --fullpage

了解更多关于截图和其他功能的信息

对于 Firefox 版本 < 60:

按下Shift+F2或转到工具 > Web 开发者 > 开发者工具栏来打开一个命令行，然后输入：

screenshot

按下Enter键以截取屏幕截图。

为了全面回答问题，您甚至可以保存整个页面，而不仅仅是可见部分：

screenshot --fullpage

要将截图复制到剪贴板，请使用--clipboard选项：

screenshot --clipboard --fullpage

Firefox 18改变了传递命令参数的方式，您需要在它们之前添加"--"。

Firefox 88.0有一种新的截屏方法。如果about:config中的extensions.screenshots.disabled设置为false，则可以右键单击屏幕并选择Take Screenshot。您还可以通过自定义将屏幕截图菜单按钮添加到菜单中。

您可以在此处找到一些文档和完整的命令列表。

_{PS：默认情况下，屏幕截图保存在下载目录中。}