您好,欢迎来到三六零分类信息网!老站,搜索引擎当天收录,欢迎发信息

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

2024/5/10 20:41:11发布24次查看
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 配置添加依赖
<!--phantomjs --><dependency>  <groupid>org.seleniumhq.selenium</groupid>  <artifactid>selenium-java</artifactid>  <version>2.53.1</version></dependency><dependency>  <groupid>com.github.detro</groupid>  <artifactid>ghostdriver</artifactid>  <version>2.1.0</version></dependency><repositories>  <repository>    <id>jitpack.io</id>    <url>https://jitpack.io</url>  </repository></repositories>
开动
主要调用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. 网络实测
在阿里云服务器上部署了一个简单的web应用,支持了html输出图片的功能;由于买的是乞丐版,用的前端模板又比较酷炫,所以打开较慢.
操作演示:
以上就是java中怎么用phantomjs完成html图片输出功能的详细内容。
该用户其它信息

VIP推荐

免费发布信息,免费发布B2B信息网站平台 - 三六零分类信息网 沪ICP备09012988号-2
企业名录 Product