Shulou(Shulou.com)05/31 Report--

This article mainly explains the "Java how to use PhantomJs to complete the html picture output function", the article explains the content is simple and clear, easy to learn and understand, the following please follow the editor's ideas slowly in-depth, together to study and learn "how to use PhantomJs in Java to complete the html picture output function"!

i. Background

How to generate a picture in Mini Program and share it in moments? At present, the front end does not seem to have a good solution, so it can only be supported by the back end, so how can we play?

It is relatively easy to generate pictures.

Simple scenarios can be directly supported by jdk, and generally speaking, there is no too complicated logic.

I have written a logic of picture synthesis before, which is realized by awt: picture synthesis.

Universal and complex templates

Simple ones can be supported directly, but more complex ones, it is undoubtedly disgusting to let the backend support. I also searched some open source libraries for rendering html on github, and I don't know if it was the wrong posture or something, and I didn't get a very satisfactory result.

Now, how to support complex templates?

This is the guide of this article, use phantomjs to achieve html rendering, support to generate pdf, generate pictures, parse dom ok, and then demonstrate how to build a web page rendering service combined with phantomjs.

ii. Prerequisite preparation

1. Phantom.js installation

# 1. Download # # mac system wget https://bitbucket.org/ariya/phantomjs/downloads/phantomjs-2.1.1-macosx.zip## linux system wget https://bitbucket.org/ariya/phantomjs/downloads/phantomjs-2.1.1-linux-x86_64.tar.bz2## windows system # # Don't play, it's no fun # 2. If unzipping sudo su tar-jxvf phantomjs-2.1.1-linux-x86_64.tar.bz2# reports an error, install the following # yum-y install bzip2# 3. To install # # simply, move to cp phantomjs-2.1.1-linux-x86_64/bin/phantomjs / usr/local/bin# 4 under the bin directory. Verify whether okphantomjs-- version# outputs the version number, which means ok

2. Java dependency configuration

Maven configuration add dependency

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

Start

The main logic to call phantomjs to render a picture with html is as follows

Public class Html2ImageByJsWrapper {private static PhantomJSDriver webDriver = getPhantomJs (); private static PhantomJSDriver getPhantomJs () {/ / set the necessary parameters DesiredCapabilities dcaps = new DesiredCapabilities (); / / ssl certificate supports dcaps.setCapability ("acceptSslCerts", true); / / screenshot supports dcaps.setCapability ("takesScreenshot", true); / / css search supports dcaps.setCapability ("cssSelectorsEnabled", true); / / js supports dcaps.setJavascriptEnabled (true) / / driver support (the second parameter indicates the path where your phantomjs engine is located, which can be viewed by which/whereis phantomjs) / / fixme. If execution is written here, you can consider whether the system is installed, and obtain the corresponding path or open to specify the path dcaps.setCapability (PhantomJSDriverService.PHANTOMJS_EXECUTABLE_PATH_PROPERTY, "/ usr/local/bin/phantomjs"). / / create interface-less browser object 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);}}

Test 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 ");}

The generated pictures will not be posted, and those who are interested can go directly to my website for measurement.

iii. Network measurement

A simple web application is deployed on Ali CVM, which supports the function of html to output pictures. Because you buy a beggar version and use a cool front-end template, it is slow to open.

Operation demonstration:

Thank you for your reading, the above is the "Java how to use PhantomJs to complete html picture output function" content, after the study of this article, I believe you on how to use PhantomJs in Java to complete html picture output function of this problem has a deeper understanding, the specific use of the situation also needs to be verified in practice. Here is, the editor will push for you more related knowledge points of the article, welcome to follow!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.