Java PhantomJs完成html图片输出功能

使用phantomJs将html页面输出为图片

一.背景

如何在小程序中生成图片并与朋友分享？目前前端好像没有什么好的解决方案，只能靠后端支撑，那怎么玩呢？

生成图片相对简单

简单的场景jdk可以直接支持，一般来说没有复杂的逻辑

之前写过一个图片合成逻辑，通过awt实现了：图片合成

通用和复杂模板

简单的可以直接支持，但是比较复杂的，让后端支持，那无疑是恶心的。我还搜索了一些开源库来在github上呈现html。不知道是姿势不对还是别扭，没有满意的结果

现在如何支持复杂的模板？

这就是本文的指南，使用phantomjs渲染html，支持pdf生成、图像生成和dom解析都可以。接下来，我们将演示如何使用phantomjs构建网页呈现服务。

二.前提准备

1.phantom.js安装

# 1.下载## mac系统wgethttps://bitbucket.org/ariya/phantom js/Downloads/phantom js-2 . 1 . 1-macosx . zip ## Linux系统wget https://bitbucket.org/ariya/phantomjs/Downloads/phantom js-2 . 1 . 1-Linux-x86 _ 64 . tar . bz2 # # Windows系统# #不玩，没啥意思# 2。解压sudo Sutar-jxvf phantom js-2 . 1 . 1-Linux-x86 _ 64 . tar . bz2 # If然后安装下面的# yum -y安装bzip2# 3。只需安装# #，并移至CP phantom js-2 . 1 . 1-Linux-x86 _ 64/bin/phantom js/usr/local/bin # 4。验证okphantom js-version #是否输出版本号，这意味着ok2

Maven配置增加了依赖性

！-phantomjs-Dependency groupIdorg.seleniumhq.selenium/groupId artifactId selenium-Java/artifactId版本2 . 53 . 1/版本/Dependency Dependency groupIdcom.github.detro/groupId artifactIdghostdriver/artifactId版本2 . 1 . 0/版本/Dependency Repository idjitpack.io/id urlhttps://jitpack.io/url/Repository/Repositories启动

主要调用phantomjs通过html渲染图片的逻辑如下

公共类Html2ImageByJsWrapper {私有静态Phantomjsdriver webDriver=GetPhantomjs()；私有静态幻影JSDriver get phantom JS(){//设置所需参数Desired captions D Caps=New Desired captions()；//ssl证书支持dcaps . setcapability(' acceptslcerts '，true)；//截图支持dcaps.set功能('截图'，true)；//css搜索支持dcaps . set capability(' CSS selectorsenabled '，true)；//js支持dcaps . setjavascriptenabled(true)；//驱动程序支持(第二个参数表示你的phantomjs引擎所在的路径，可以查看哪个/在哪里的phantom js)//fixme在这里写了执行，可以考虑系统是否安装。并获取对应的路径或打开它指定路径dcaps . set capability(phantom jsdriverservice . phantom js _ executive _ path _ property，'/usr/local/bin/phantom js ')；//创建一个无接口的浏览器对象返回新的Phantomjsdriver(dcaps)；}公共静态BufferedImage renderhtml 2 image(String URL)引发IOException { webdriver . get(URL)；file file=Webdriver . getscreenshotas(OutPuttype。FILE)；返回ImageIO.read(文件)；}}测试用例

公共类base64 util {公共静态字符串编码(缓冲区大小缓冲区大小，字符串类型)引发IOException { bytearayoutstream Outputstream=new bytearayoutstream()；ImageIO.write(bufferedImage、imgType、outputStream)；返回编码（输出流);}公共静态字符串编码（字节数组输出流输出流){返回Base64.getEncoder().encodetstring(outputstream。tobytearray())；}}@Testpublic void testRender()引发IOException { BufferedImage img=null；for(int I=0；i 20I){ String URL=' https://my。奥希娜。net/u/566591/blog/1580020 '；长启动=系统。current millis()；img=html 2 imagebyjswrapper。renderhtml 2图像(URL)；长端=系统。current millis()；系统。出去。println('成本： '(end-start))；}系统。出去。println(64号基地。编码(img，' png ')；}生成的图片就不贴了，有兴趣的可以直接到我的网站上实测

三。网络实测

在阿里云服务器上部署了一个简单的网应用，支持了超文本标记语言输出图片的功能；由于买的是乞丐版，用的前端模板又比较酷炫，所以打开较慢。

操作演示：

动词(动词的缩写)项目

项目地址：

快速媒体

快速媒体是一个专注图文，音视频，二维码处理等面向多媒体服务的开源项目

以上代码经过我们的测试，大家如果还有不明白可需要讨论的可以在下方留言，感谢你对我们的支持。