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.
See this DEMO (Be aware that it is running on a $5 digitalocean machine. Be patient!)
- node-webkit in
PATH
- node
- redis
On OS X the node-webkit executable is called node-webkit
and on linux and Windows it's called nw
. Keep that in mind.
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
.)
The result of each request will be the requested image.
# Take a screenshot
GET /?url=www.google.com
# Return a 1024x600 PNG screenshot of the www.google.com homepage
# Take a screenshot with transparency
GET /?url=www.google.com&transparent=true
# Return a 1024x600 PNG screenshot of the www.google.com homepage
# Take a screenshot of the whole page
GET /?url=www.google.com&page=true
# Return a screenshot of the whole www.google.com homepage
# Custom viewport size
GET /?url=www.google.com&width=800&height=600
# Return a 800x600 PNG screenshot of the www.google.com homepage
# Screenshot delay
GET /?url=www.google.com&delay=1000
# Return a 1024x600 PNG screenshot of the www.google.com homepage
# 1 second after it's loaded
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]"}
This project is using node-config.
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.
Please change the default password in nodeshot-server/config/default.yaml
DISCLAIMER: For WebGL/3D CSS support you need hardware acceleration. Keep that in mind!
- Go to
https://www.digitalocean.com/
- Create a $5 droplet with Ubuntu
- Login via
ssh
- 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
- 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
Joshua Hibbert for creating the logo.