⚠️ This is no longer maintained⚠️
A simple screenshot web service powered by Kue, Express and electron. Inspired by fzaninotto/screenshot-as-a-service
This screenshot-service is using node-webkit which comes with a recent version of Chromium. In contrast to phantomjs node-webkit supports 3D CSS and WebGL and therefore can produce better screenshots.
Example
See this DEMO (Be aware that it is running on a $5 digitalocean machine. Be patient!)
Requirements
- node-webkit in
PATH
- node
- redis
Things you should know
On OS X the node-webkit executable is called node-webkit
and on linux and Windows it's called nw
. Keep that in mind.
Running
git clone https://github.com/FWeinb/nodeshot.git && cd nodeshot
- Bootstrap the project
./bootstrap.sh
- Start/Install redis
- Run
./start.sh server
once - Run
./start.sh renderer X
whereX
is is the number/name of the renderer. (You can start more than one) - Open
http://localhost:8080/?url=http://s.codepen.io/FWeinb/fullpage/oyACz
- See
http://localhost:8080/kue
for queued jobs. (See the password innodeshot-server/config/default.yaml
.)
API Usage
Simple API
The result of each request will be the requested image.
Take a screenshot
GET /?url=www.google.com
Returns a 1024x600 PNG screenshot of the www.google.com homepage
Take a screenshot with transparency
GET /?url=www.google.com&transparent=true
Returns a 1024x600 PNG screenshot of the www.google.com homepage
Take a screenshot of the whole page
GET /?url=www.google.com&page=true
Returns a screenshot of the whole www.google.com homepage
Custom viewport size
GET /?url=www.google.com&width=800&height=600
Returns a 800x600 PNG screenshot of the www.google.com homepage
Screenshot delay
GET /?url=www.google.com&delay=1000
Returns a 1024x600 PNG screenshot of the www.google.com homepage 1 second after it's loaded
Force cache reload
GET /?url=www.google.com&forceReload=1
Deletes current version in cache and returns a (new) 1024x600 PNG screenshot of the www.google.com homepage, which will be cached again
Ajax API
The result of each request will be an JSON object.
Same options as in the Simple API. Just prefix the request with /ajax/
Example:
# Take a screenshot
GET /ajax/?url=www.google.com
# Success: 200 {"request" : "success", "url" : "[URL to resulting image]"}
# Error: 500 {"request" : "failed", "reason" : "[Message]"}
Configuration
This project is using node-config.
Extended configuration
node-webkit can pass startup flags to chromium via the chromium-args
value
in the package.json
. See node-webkit manifest-format for more information.
CAUTION
Please change the default password in nodeshot-server/config/default.yaml
Using a headless node-webkit via xvfb
DISCLAIMER: For WebGL/3D CSS support you need hardware acceleration. Keep that in mind!
Get a VM (optional)
- Go to
https://www.digitalocean.com/
- Create a $5 droplet with Ubuntu
- Login via
ssh
Installing xvfb
- Install minmal xorg
sudo apt-get install xorg
- Install xvfb
sudo apt-get install xvfb
- Install fonts
sudo apt-get install xfonts-100dpi xfonts-75dpi xfonts-scalable xfonts-cyrillic
- Install ttf fonts
sudo apt-get install -y x-ttcidfont-conf cabextract ttf-mscorefonts-installer
(Accept the EULA) - Reconfigure fonts
sudo dpkg-reconfigure --default-priority x-ttcidfont-conf
(This fixed an issue for me) - Start xvfb on display :99
xvfb :99 &
- Make :99 the default display
export DISPLAY=:99
Installing node-webkit and screenshot-service
- Download node-webkit and put it on
PATH
- Start/Install redis
- Get this repo
git clone https://github.com/fweinb/nodeshot && cd nodeshot
- Bootstrap the project
./bootstrap.sh
- Run
./start.sh server
once - Run
./start.sh renderer X
whereX
is is the number/name of the renderer. (You can start more than one) - Open
http://[IP]:8080/?url=http://s.codepen.io/FWeinb/fullpage/oyACz
Thanks to
Joshua Hibbert for creating the logo.