32

Are there any headless browsers for node.js that support dumping a rendered page out to a file? I know phantomjs supports rendering to a file, but it doesn't run on node.js. I know zombie.js is a node.js headless browser, but it doesn't support rendering to a file.

ryeguy
  • 65,519
  • 58
  • 198
  • 260
  • 1
    Have you looked for projects that use jsdom? I know there are a few for doing this, just forget the names – wesbos Aug 18 '11 at 13:40
  • 2
    There is a new phantom-node wrapper here that lets you run phantomjs from Node.. have not tried it but it looks promising: https://github.com/sgentle/phantomjs-node – Carol Skelly Feb 08 '12 at 16:31
  • 2
    Wes, jsdom creates and manipulates Document Object Models that are entirely non-graphical in-memory data structures. This question is about fully rendering a graphical web page, which is another matter entirely. – Peter Lyons Aug 27 '12 at 03:38
  • You can try this one: https://github.com/vbauer/manet It is based on NodeJS & SlimerJS and works as separate service through REST API. – Vladislav Bauer Nov 16 '14 at 10:05

6 Answers6

12

I doubt you will find anything that is going to work as well as phantomjs. I would just treat the rendering as an async backend process and execute phantom in a subprocess from your main node.js process and call it a day. Rendering a web page is HARD, and since phantom is based on WebKit, it can actually do it. I don't think there will ever be a node library that can render a web page to a graphic file that isn't built upon an existing browser rendering engine. But maybe one day phantomjs will integrate more seamlessly with node.

Peter Lyons
  • 142,938
  • 30
  • 279
  • 274
  • 6
    I thoroughly expect a followup link, @David Murdoch. – NateDSaint Aug 27 '12 at 02:49
  • I hacked away at it for a bit today and didn't get as far as I had hoped. I was planning on mashing together jsdom, node-canvas, and html2canvas. I didn't realize jsdom didn't implement dimensions. :-( – David Murdoch Aug 28 '12 at 00:10
  • Someone else could maybe check on compiling Webkit to LLVM then to JS with emscriptent; I just don't have the time. – David Murdoch Aug 28 '12 at 00:13
  • 3
    I ended up doing two command-line linux utils: wkhtmltopdf and then using imagemagick convert to convert the pdf to a jpg. This fit my needs because I needed a PDF for another part of the task, but I'm still interested in learning how to made node.js do the trick. – NateDSaint Oct 03 '12 at 13:59
5

Try nightmare, it uses the electron, it is way faster than phantomjs, and it's API easy and uses modern ES6 javascript.

Rilke Petrosky
  • 1,155
  • 9
  • 12
3

This might look like a solution with a little bit overhead...

You can use the Mozilla Firefox with the MozRepl plugin. Basically this plugin gives you a telnet port to your Firefox which allows you to control the browser from the outside. You can open URLs, take screenshots, etc. Running the Firefox with the Xvfb server will run it in headless mode.

Now you just have to control the browser from the outside with node.js. I've seen a few examples where someone has implemented a http alike interface inside the chrome.js of Firefox. So you can run a http command to get a screenshot. You can then use http calls from node.js. This might look strange, it actually is but might work well for you.

I'm running a slightly modified version in production with Perl Mojolicious in async mode to trigger the screenshots. However, there is a small problem. When plugins are required they do work, however Flash usually gets activated when it's in the visible area, this won't happen so movies/flash things might not get initialized.

3

You might find this helpful, though it's not javascript specific.

There is a webkit-based tool called "wkhtmltopdf" that I understand includes javascript support using the QT web-kit widget. It outputs a visual representation ("screenshot" if you will) of the page in PDF format.

FWIW, there are also PHP bindings for it here: php-wkthmltox

AJPerez
  • 3,435
  • 10
  • 61
  • 91
David
  • 13,133
  • 1
  • 30
  • 39
2

The Chrome dev team has released Puppeteer which can be used in node. It uses Chrome with the headless option.

kev
  • 8,928
  • 14
  • 61
  • 103
1

There's a project called Node-Chimera. Although it's not as mature as Phantomjs, it has all the features you have mentioned: it runs on native Nodejs, and allows you to render pages to a file. Repository is here: https://github.com/deanmao/node-chimera. It has examples to do exactly what you need.

krakatoa
  • 11
  • 2