Java中PhantomJs怎么完成html图片输出功能

这篇"Java中PhantomJs怎么完成html图片输出功能"文章的知识点大部分人都不太理解，所以小编给大家总结了以下内容，内容详细，步骤清晰，具有一定的借鉴价值，希望大家阅读完这篇文章能有所收获，下面我们一起来看看这篇"Java中PhantomJs怎么完成html图片输出功能"文章吧。

I. 背景

如何在小程序里面生成一张图，分享到朋友圈呢？目前前端貌似没有太好的解决方法，所以只能猥琐的由后端来支持掉，那么可以怎么玩？

生成图片比较简单

简单的场景，可以直接用jdk来支持掉，一般来讲也没有太复杂的逻辑

之前写过一个图片合成的逻辑，利用awt实现: 图片合成

通用、复杂的模板

简单的可以直接支持，但复杂一点的，让后端来支持，无疑比较恶心，在github上也搜索了一些渲染html的开源库，不知道是姿势不对还是咋的，没有太满意的结果

现在对复杂的模板，要怎么支持呢？

也就是本篇的指南，利用phantomjs来实现html的渲染，支持生成pdf，生成图片，解析dom都ok，接下来则演示下如何结合 phantomjs 搭建一个网页渲染成图片的服务

II. 前提准备

1. phantom.js 安装

# 1. 下载## mac 系统wget https://bitbucket.org/ariya/phantomjs/downloads/phantomjs-2.1.1-macosx.zip## linux 系统wget https://bitbucket.org/ariya/phantomjs/downloads/phantomjs-2.1.1-linux-x86_64.tar.bz2## windows 系统## 就不要玩了，没啥意思# 2. 解压sudo su tar -jxvf phantomjs-2.1.1-linux-x86_64.tar.bz2# 如果解压报错，则安装下面的# yum -y install bzip2# 3. 安装## 简单点，移动到bin目录下cp phantomjs-2.1.1-linux-x86_64/bin/phantomjs /usr/local/bin# 4. 验证是否okphantomjs --version# 输出版本号，则表示ok

2. java依赖配置

maven 配置添加依赖

  org.seleniumhq.selenium  selenium-java  2.53.1  com.github.detro  ghostdriver  2.1.0      jitpack.io    https://jitpack.io  

开动

主要调用phantomjs来实现html渲染图片的逻辑如下

public class Html2ImageByJsWrapper {  private static PhantomJSDriver webDriver = getPhantomJs();  private static PhantomJSDriver getPhantomJs() {    //设置必要参数    DesiredCapabilities dcaps = new DesiredCapabilities();    //ssl证书支持    dcaps.setCapability("acceptSslCerts", true);    //截屏支持    dcaps.setCapability("takesScreenshot", true);    //css搜索支持    dcaps.setCapability("cssSelectorsEnabled", true);    //js支持    dcaps.setJavascriptEnabled(true);    //驱动支持（第二参数表明的是你的phantomjs引擎所在的路径，which/whereis phantomjs可以查看）    // fixme 这里写了执行， 可以考虑判断系统是否有安装，并获取对应的路径 or 开放出来指定路径    dcaps.setCapability(PhantomJSDriverService.PHANTOMJS_EXECUTABLE_PATH_PROPERTY, "/usr/local/bin/phantomjs");    //创建无界面浏览器对象    return new PhantomJSDriver(dcaps);  }  public static BufferedImage renderHtml2Image(String url) throws IOException {    webDriver.get(url);    File file = webDriver.getScreenshotAs(OutputType.FILE);    return ImageIO.read(file);  }}

测试case

public class Base64Util {  public static String encode(BufferedImage bufferedImage, String imgType) throws IOException {    ByteArrayOutputStream outputStream = new ByteArrayOutputStream();    ImageIO.write(bufferedImage, imgType, outputStream);    return encode(outputStream);  }  public static String encode(ByteArrayOutputStream outputStream) {    return Base64.getEncoder().encodeToString(outputStream.toByteArray());  }}@Testpublic void testRender() throws IOException {  BufferedImage img = null;  for (int i = 0; i < 20; ++i) {    String url = "https://my.oschina.net/u/566591/blog/1580020";    long start = System.currentTimeMillis();    img = Html2ImageByJsWrapper.renderHtml2Image(url);    long end = System.currentTimeMillis();    System.out.println("cost: " + (end - start));  }  System.out.println(Base64Util.encode(img, "png"));}

III. 网络实测

操作演示:

以上就是关于"Java中PhantomJs怎么完成html图片输出功能"这篇文章的内容，相信大家都有了一定的了解，希望小编分享的内容对大家有帮助，若想了解更多相关的知识内容，请关注行业资讯频道。