背景:
项目中想要对某个页面进行截图,作为缩略图展示,但是希望在后台自动进行,而不需要用户手动执行。所以能想到的办法就是通过前端给一个链接,后端在链接上拼接对应的参数,来获取指定的页面,然后通过一个方法,对输入的网页进行截图保存。
实现:
在Java中实现对一个给定链接的网页内容加载完毕后进行截图并保存,通常需要结合浏览器内核(如使用headless模式的Chrome或Firefox)和自动化工具。以下是一个基于Selenium WebDriver与Chromedriver的示例步骤:
引入依赖
(需要注意selenium-java这个依赖中并不包含最新版本的selenium其他依赖,所以要手动加一下,否则其他依赖都是很老的版本,会有找不到类的报错)
<dependency>
<groupId>org.seleniumhq.selenium</groupId>
<artifactId>selenium-java</artifactId>
<version>4.16.1</version>
</dependency>
<dependency>
<groupId>io.github.bonigarcia</groupId>
<artifactId>webdrivermanager</artifactId>
<version>5.6.3</version>
</dependency>
<dependency>
<groupId>org.apache.httpcomponents.client5</groupId>
<artifactId>httpclient5</artifactId>
<version>5.3</version>
</dependency>
<dependency>
<groupId>org.seleniumhq.selenium</groupId>
<artifactId>selenium-api</artifactId>
<version>4.16.1</version>
</dependency>
<dependency>
<groupId>org.seleniumhq.selenium</groupId>
<artifactId>selenium-chrome-driver</artifactId>
<version>4.16.1</version>
</dependency>
<dependency>
<groupId>org.seleniumhq.selenium</groupId>
<artifactId>selenium-remote-driver</artifactId>
<version>4.16.1</version>
</dependency>
<dependency>
<groupId>org.seleniumhq.selenium</groupId>
<artifactId>selenium-support</artifactId>
<version>4.16.1</version>
</dependency>
测试代码
public static void main(String[] args) {
// 设置ChromeDriver路径(如果WebDriverManager未自动处理)
WebDriverManager.chromedriver().setup();
// 启用Headless模式(可选,用于无界面截图)
ChromeOptions options = new ChromeOptions();
options.addArguments("--headless", "--disable-gpu");
options.addArguments("--window-size=1920,1080");
// 创建WebDriver实例
WebDriver driver = new ChromeDriver(options);
try {
List<String> urls = new ArrayList<>();
urls.add("https://www.baidu.com/");
urls.add("https://www.jianshu.com/");
urls.forEach(url -> {
driver.get(url);
try {
Thread.sleep(3000); // 延迟5秒,仅供参考,请根据实际情况调整
} catch (InterruptedException e) {
throw new RuntimeException(e);
}
// 截取全屏图片
TakesScreenshot takesScreenshot = (TakesScreenshot) driver;
byte[] screenshotData = takesScreenshot.getScreenshotAs(OutputType.BYTES);
// 保存截图到文件
BufferedImage fullImage;
try {
fullImage = ImageIO.read(((TakesScreenshot) driver).getScreenshotAs(OutputType.FILE));
} catch (IOException e) {
throw new RuntimeException(e);
}
// 保存全屏截图到本地,根据URL生成不同的文件名
String fileName = url.replaceAll("[^a-zA-Z0-9]", "_") + ".png";
File screenshotFile = new File(fileName);
try {
ImageIO.write(fullImage, "PNG", screenshotFile);
} catch (IOException e) {
throw new RuntimeException(e);
}
driver.navigate().refresh();
});
} catch (Exception e) {
e.printStackTrace();
} finally {
// 关闭浏览器
driver.quit();
}
}
以上是在本地运行时所使用的代码,当部署到服务器上时,与本地运行大有不同(因为本地装有谷歌浏览器)
在生产环境中使用的方法如下
安装chrome镜像
selenium有专门的谷歌浏览器以及驱动镜像,直接拉取这个镜像selenium/standalone-chrome(它包含了 Selenium Grid 服务器和一个预配置好的 Chrome 浏览器环境。使用这个镜像无需在本地安装和配置 Selenium 以及浏览器驱动)。在容器中运行,命令是docker run -d -p 4444:4444 --shm-size=2g selenium/standalone-chrome,其中--shm-size=2g是用于设置容器的共享内存大小(如果没有足够的共享内存,浏览器可能会遇到性能问题或直接崩溃)。
@PostMapping(value = "/test")
public void test() throws MalformedURLException {
// 启用Headless模式(可选,用于无界面截图)
ChromeOptions options = new ChromeOptions();
options.addArguments("--disable-gpu");
options.addArguments("--window-size=1920,1080");
DesiredCapabilities capabilities = new DesiredCapabilities();
capabilities.setCapability(ChromeOptions.CAPABILITY, options);
// 创建指向Selenium Grid的RemoteWebDriver实例,url部分为容器中的chrome地址
WebDriver driver = new RemoteWebDriver(new URL("http://0.0.0.0:4444/wd/hub"), capabilities);
try {
List<String> urls = new ArrayList<>();
urls.add("https://www.baidu.com/");
urls.add("https://www.jianshu.com/");
urls.forEach(url -> {
driver.get(url);
try {
Thread.sleep(10000); // 延迟5秒,仅供参考,请根据实际情况调整
} catch (InterruptedException e) {
throw new RuntimeException(e);
}
// 保存截图到文件
BufferedImage fullImage;
try {
fullImage = ImageIO.read(((TakesScreenshot) driver).getScreenshotAs(OutputType.FILE));
} catch (IOException e) {
throw new RuntimeException(e);
}
// 保存全屏截图到本地,根据URL生成不同的文件名
String fileName = url.replaceAll("[^a-zA-Z0-9]", "_") + ".png";
File screenshotFile = new File(fileName);
try {
ImageIO.write(fullImage, "PNG", screenshotFile);
} catch (IOException e) {
throw new RuntimeException(e);
}
driver.navigate().refresh();
});
} catch (Exception e) {
e.printStackTrace();
} finally {
// 关闭浏览器
driver.quit();
}
}