How to take screenshot of a website with Rails 3.1? -- without using a service

Question

Almost every answer I've found references using some existing service. Is there a way to do this using Rails 3.1 programmatically? This was dead easy to do with PHP (there are prebuilt libraries in PHP that do this).

What I'm looking to do, given a URL, is:

Take a screenshot of the website
Crop it (only take the top left most 100x100 pixels

PS. Here is my environment: Rails 3.1, Ruby 1.9.2

Note: The solution would probably need to follow any redirections on the URL as well.

Updates:

I've seen https://github.com/topfunky/osxscreenshot The problem is that it requires an older version of Ruby (1.8.x) and will only work on my dev Mac machine.
I've seen the vulnerability with Wordpress (they have a service that doesn't do any rate limiting which someone could potentially abuse). I would not want to abuse their resources for my benefit... http://s.wordpress.com/mshots/v1/http%3A%2F%2Fstackoverflow.com%2F?w=500
The cropping will be easy with http://rmagick.rubyforge.org/ or https://github.com/thoughtbot/paperclip

score 8 · Answer 1 · answered Dec 05 '12 at 12:06

8

There is a Rails gem for this task.

 gem install selenium-webdriver

Simple use case:

require 'selenium-webdriver'
 width = 1024
 height = 728
 driver = Selenium::WebDriver.for :firefox
 driver.navigate.to 'http://domain.com'
 driver.execute_script %Q{
   window.resizeTo(#{width}, #{height});
 }
 driver.save_screenshot('/tmp/screenshot.png')
 driver.quit

answered Dec 05 '12 at 12:06

Cninroh

1,796
2
21
37

Clever solution, though I think it needs to be installed on a client with those browsers installed as I had trouble server side doing this. – jklp Jul 03 '13 at 04:33
Note that execute_script part should be replaced with `driver.manage.window.resize_to(width,height)` – Martin Jul 24 '13 at 07:00
This works thx! But how can I do to execute same script on my linux server (without browser)? – Matrix Jan 31 '15 at 18:51

score 4 · Answer 2 · answered Nov 21 '11 at 22:00

4

This might help: https://github.com/csquared/IMGKit

answered Nov 21 '11 at 22:00

craig.kaminsky

5,588
28
31

It's dependent on wkhtmltoimage which is not available for many platforms (including Mac) – user1049097 Nov 21 '11 at 22:17
1

wkhtmltoimage is available on Mac. – Ashley Feb 05 '12 at 23:08

score 2 · Answer 3 · answered Nov 21 '11 at 22:11

2

You could use wkhtmltoimage to load up the webpage and save it as an image, then imagemagick, (or one of the ruby wrappers for it) to crop it.

wkhtmltoimage www.google.com output.jpg
convert -crop 100x100+0+100 output.jpg cropped.jpg

There isn't a prebuilt wkhtmltoimage binary for OSX though, so perhaps you may want to use wkhtmltopdf instead and then imagemagick to convert to an image.

wkthmltopdf www.google.com output.pdf
convert -crop 100x100+0+100 output.pdf cropped.jpg

answered Nov 21 '11 at 22:11

Unixmonkey

18,485
7
55
78

The rendering of wkthmltopdf appears to bad for most sites :( Otherwise this would have been the way to go. – user1049097 Nov 21 '11 at 22:20
@user1049097 I've never had a problem with it. Maybe you don't have enough fonts or a QT-enabled build. – Unixmonkey Nov 21 '11 at 22:30
I'm going to try this again on mac and see if I'm missing any fonts, etc. Thanks! – user1049097 Nov 21 '11 at 22:42

score 2 · Answer 4 · answered Nov 21 '11 at 22:37

A simple, but Mac only, solution seems to be http://www.paulhammond.org/webkit2png/

Just chmod -x that script and use as python webkit2png http://www.google.com/ and it creates 3 files:

Full screenshot
Thumbnail of the top most portion of site
Thumbnail of the full screenshot

How to take screenshot of a website with Rails 3.1? -- without using a service

4 Answers4

Linked