如何使用Selenium和Java获取完整网页的屏幕截图？

screenshot selenium selenium-webdriver java webdriver

2022-09-02 00:52:59

如何使用Selenium WebDriver截取整个网页的屏幕截图（整页屏幕截图），而不仅仅是部分（从上到下）？

我的代码：（Java绑定）)

System.setProperty("webdriver.chrome.driver","/home/alex/Downloads/chromedriver_linux64/chromedriver");
WebDriver driver = new ChromeDriver();
driver.get("http://google.com");
File scrFile = ((TakesScreenshot)driver).getScreenshotAs(OutputType.FILE);
FileUtils.copyFile(scrFile, new File(RESULT_FILENAME));

关于如何解决这个问题的任何想法？

答案 1

乐：我看到很多人对整页截图感兴趣，所以我想我可能会用一些积极的（银弹）来更新答案。

有相当多的Web测试框架可以（以最少的设置和努力）生成整页屏幕截图。我来自NodeJS测试环境，所以我只能保证以下内容：WebdriverIO和Google的Puppeteer。

如果有人对使用WebdriverIO执行此操作的简单方法感兴趣，请检查此答案。

简短的回答是不，你不能，如果你只使用硒（详细原因波纹管）。但是，您可以做的是充分利用设备的（显示器）视口。

因此，请使用启动浏览器实例（驱动程序），这是设置 ChromeDriver 特定功能的方法。我们可以执行以下操作：ChromeOptions()

最大化窗口（使用开关）;--start-maximized
全屏显示（在 Windows 上按键，在 Mac 上使用开关）。F11Control+Cmd+F--start-fullscreen
注意：可在此处找到 Chrome 命令行开关的完整列表。

您的代码应如下所示：

// Setting your Chrome options (Desired capabilities)
ChromeOptions options = new ChromeOptions();
options.add_argument('--start-maximized');
options.add_argument('--start-fullscreen');

// Creating a driver instance with the previous capabilities
WebDriver driver = new ChromeDriver(options);

// Load page & take screenshot of full-screen page
driver.get("http://google.com");
File scrFile = ((TakesScreenshot)driver).getScreenshotAs(OutputType.FILE);

现在关于整页问题，所有驱动程序（，，，等）都在实现WebDriver W3C标准。因此，它们依赖于WebDriver团队想要公开不同功能的功能的方式，在我们的例子中，“截取屏幕截图”。chromedrivergeckodriverIEDriverEdgeDriver

如果您阅读该定义，它清楚地说明了以下内容：

“截取屏幕截图”命令获取顶级浏览上下文的 VIEWPORT 的屏幕截图。

在传统方面，一些驱动程序能够生成整页屏幕截图（在此处阅读更多相关信息），例如旧的FirefoxDriver，IEDriver等。现在情况已经不同了，因为他们现在都实现了（确切地说）WebDriver W3C标准。

答案 2

现在有一个简单的方法可以使用Selenium 4和Firefox做到这一点。

byte[] imageBytes = ((FirefoxDriver)driver).getFullPageScreenshotAs(OutputType.BYTES);
Files.write(Paths.get(RESULT_FILENAME), imageBytes);

其他浏览器尚不支持。getFullPageScreenshotAs()