• This repository has been archived on 12/Aug/2019
  • Stars
    star
    134
  • Rank 270,967 (Top 6 %)
  • Language
    JavaScript
  • Created over 10 years ago
  • Updated over 8 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

A simple screenshot web service powered by Express and node-webkit.

⚠️ 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

  1. node-webkit in PATH
  2. node
  3. 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

  1. git clone https://github.com/FWeinb/nodeshot.git && cd nodeshot
  2. Bootstrap the project ./bootstrap.sh
  3. Start/Install redis
  4. Run ./start.sh server once
  5. Run ./start.sh renderer X where X is is the number/name of the renderer. (You can start more than one)
  6. Open http://localhost:8080/?url=http://s.codepen.io/FWeinb/fullpage/oyACz
  7. See http://localhost:8080/kue for queued jobs. (See the password in nodeshot-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)

  1. Go to https://www.digitalocean.com/
  2. Create a $5 droplet with Ubuntu
  3. Login via ssh

Installing xvfb

  1. Install minmal xorg sudo apt-get install xorg
  2. Install xvfb sudo apt-get install xvfb
  3. Install fonts sudo apt-get install xfonts-100dpi xfonts-75dpi xfonts-scalable xfonts-cyrillic
  4. Install ttf fonts sudo apt-get install -y x-ttcidfont-conf cabextract ttf-mscorefonts-installer (Accept the EULA)
  5. Reconfigure fonts sudo dpkg-reconfigure --default-priority x-ttcidfont-conf (This fixed an issue for me)
  6. Start xvfb on display :99 xvfb :99 &
  7. Make :99 the default display export DISPLAY=:99

Installing node-webkit and screenshot-service

  1. Download node-webkit and put it on PATH
  2. Start/Install redis
  3. Get this repo git clone https://github.com/fweinb/nodeshot && cd nodeshot
  4. Bootstrap the project ./bootstrap.sh
  5. Run ./start.sh server once
  6. Run ./start.sh renderer X where X is is the number/name of the renderer. (You can start more than one)
  7. Open http://[IP]:8080/?url=http://s.codepen.io/FWeinb/fullpage/oyACz

Thanks to

Joshua Hibbert for creating the logo.

More Repositories

1

grunt-svgstore

Merge svgs from a folder
JavaScript
920
star
2

electron-screenshot-service

Take screenshots using electron
JavaScript
142
star
3

Scrubbing.js

Highly customizable mouse scrubbing implementation for numbers and custom data.
JavaScript
79
star
4

rclone-js

Encrypt/Decrypt files in your browser
JavaScript
76
star
5

node-osascript

Use AppleScript from node
JavaScript
68
star
6

metalsmith-watch

A metalsmith plugin to watch for a changes and trigger rebuilds.
JavaScript
60
star
7

ios7translucent-css

Implementation of the iOS7 translucent topbar using CSS Regions Implementation of the iOS7 translucent topbar using CSS Regions
CSS
58
star
8

nthEverything

Adding pseudo classes ::nth-word/letter ::first/last-word/letter
JavaScript
43
star
9

electron-screenshot-app

Take screenshots
JavaScript
40
star
10

node-webkit-screenshot

Create screenshots using node-webkit
JavaScript
37
star
11

grunt-scsslint

NO LONGER MAINTAINED use https://github.com/ahmednuaman/grunt-scss-lint
JavaScript
31
star
12

cssattr.js

CSS attr() Polyfill
JavaScript
30
star
13

homebridge-rcswitch

Integrate your 433 remote switches into homebridge
JavaScript
17
star
14

ESP8266-WebSocket-Demo

Play a video on an SSD1306
Objective-C
16
star
15

socket-connection

Web Component to interact with a http://socket.io/ server
14
star
16

CDocParser

A language agonistc C style comments parser that uses block comments to make it easer to generate documenation.
JavaScript
11
star
17

sb-layout

Build https://scriptable.app widgets using JSX-like syntax
JavaScript
10
star
18

react-thumbnail

Include a static version of a webpage or your react element
JavaScript
8
star
19

tlkio-bot

Just a simple tlk-io bot that can do things
JavaScript
8
star
20

scsslint

nodejs bindings for scss-lint
JavaScript
6
star
21

moddable-webide

A WebIDE to get started with moddable
JavaScript
6
star
22

oracle-secret

Encode/Decode Legend of Zelda Oracle of Ages and Oracle of Seasons secrets.
JavaScript
5
star
23

jqueryhighlight

A little plugin to search for text in the DOM
JavaScript
4
star
24

websocket.mod

A WebSocket written in BlitzMax.
3
star
25

tlkio-client

Kinda low-level tlkio-client used by hubot-tlkio and my own tlkio-bot
CoffeeScript
3
star
26

hot-key

A Polymer element for lisiting to keyboard events
2
star
27

nodequote

quote.fm API wrapper for nodejs
JavaScript
2
star
28

uriFragmentPolyfill

Polyfill for the spatial dimension portion of the Media Fragments URI spec (http://www.w3.org/TR/media-frags/#naming-space)
JavaScript
2
star
29

component-load

A web component to dynamically load web components.
1
star
30

sassyjson_examples

Basic usage examples for various configurations
JavaScript
1
star
31

my-tlkio-bot

a hubot with my hubot-tlkio adapter.
CoffeeScript
1
star
32

hubot-tlkio

Hubot adapter for tlkio
CoffeeScript
1
star
33

RWTHKalenderAbo

Sync with CampusOffice
JavaScript
1
star
34

esphome-moddable

Early draft of the protobuf based ESPHome native api for moddable
TypeScript
1
star
35

babel-plugin-named-asset-import

[Not maintained] Asset loading based on named import
JavaScript
1
star