Home > Applications & Tools > PhantomJS: Convert Any Web Pages to PDF or PNG on Server Side

PhantomJS: Convert Any Web Pages to PDF or PNG on Server Side

November 14th, 2016 Leave a comment Go to comments

While developing a new feature for our vSearch product, I found the Javascript’s capability to screenshot a page is quite limited. As normal, the explanation is that it’s designed as such due to security reasons. No one wants a Javascript secretly capture a screenshot of what’s currently viewed. I personally don’t think it’s a good explanation why it’s not implemented as easily as it should have been. Similar, I think riskier, features like exchange clipboard content has been implemented.

Anyway, there is a backup plan which is to use PhantomJS tool. You can simply think it as a browswer, but it has no GUI. Sounds contradictory? It can be used for GUI testing, exporting Web content to different format, etc.

Time to learn how to "Google" and manage your VMware and clouds in a fast and secure

HTML5 App

The phantomjs can be easily installed and run on various platforms. I just did one on CentOS and find it’s pretty easy and fast.

Here are the steps to get it installed. If you use a different platform (32 bits or Windows, Mac), you can find their links from the download page.

# cd /opt
# wget https://bitbucket.org/ariya/phantomjs/downloads/phantomjs-2.1.1-linux-x86_64.tar.bz2
# tar xvf phantomjs-2.1.1-linux-x86_64.tar.bz2
# ln -s phantomjs-2.1.1-linux-x86_64/bin/phantomjs /usr/local/bin
 
# yum install freetype fontconfig

Now, let’s write a simple Javascript code as follows:

#vi saveHtml2pdf.js
var WebPage = require('webpage');
page = WebPage.create();
page.open('http://doublecloud.org');
page.onLoadFinished = function() {
  page.render('doublecloud_org' + '.png');
  phantom.exit();
}

The Javascript above is quite simple. It basically creates a new Web page and then open to a URL to this site. You can always change it to any site of your choice. The onLoadFinished is a callback function that is called when the page is done with page loading. The function instructs the WebPage object to render it to png file and exit the phantom engine. If you want to save it to PDF, you can simply change the “.png” to “.pdf”.

When you are ready, you can run the following command and get the png file of my blog site in the same folder.

# phantomjs saveHtml2pdf.js

This is just the very basic of what phantomjs can do. You can check out many more use cases where phantomjs can help.

  1. November 14th, 2016 at 00:01 | #1

    [DoubleCloud] PhantomJS: Convert Any Web Pages to PDF or PNG on Server Side https://t.co/aDSv5zyXkc

  2. November 14th, 2016 at 01:27 | #2

    PhantomJS: Convert Any Web Pages to PDF or PNG on Server Side https://t.co/NYhHuEpvkK #Applications_amp_Tools #JavaScript

  1. No trackbacks yet.