wkhtmltoimageをChefで入れてスクリーンショットを撮ってみる

サーバ

ストーリーボードでスライドページのスクリーンショットを取りたい。 という話があって、wkhtmltoimageを使ってみたらどうだろうと朝起きたら issueにコメントが付いていた*1のでインストールしてみました。OSはUbuntu 12.10です。

wkhtmltoimageは、webkitのエンジンを使ってページをレンダリングしてそれをJPGやPNG画像として保存することができます。

で、例によってChefを使ってレシピを下の様に書いてみました。

# default.rb

%w{libxrender1 libfontconfig1 otf-ipafont-gothic libxext6}.each do |pkg|
  package pkg do
    action :install
  end
end

bash "wkhtmltoimage install." do
  user "root"
  cwd "/tmp"
  code <<-EOH
    wget 'https://wkhtmltopdf.googlecode.com/files/wkhtmltoimage-0.10.0_rc2-static-amd64.tar.bz2';
    tar xjfv wkhtmltoimage-0.10.0_rc2-static-amd64.tar.bz2
    mv wkhtmltoimage-amd64 /usr/local/bin
  EOH
end

やっていることとしては、wkhtmltoimage自体、バイナリがGoogle codeに圧縮されているものがあるので、それを引っ張ってきて配置するだけで、 それに依存するライブラリやスクリーンショットを撮る際に必要な日本語フォントをインストールしています。

インストールされた環境から、以下の様なコマンドを打つことでスクリーンショットを保管することができます。

$ wkhtmltoimage-amd64 --javascript-delay 5000 \
--width 800 --height 600 \
--format png --quality 70 http://www.remp.jp test.png

上の例では、

  • JavaScript実行完了から5秒待ってからスクリーンショットを撮る
  • 画像サイズは800x600
  • 画像クオリティは最高を100とした場合に70を指定
  • 画像フォーマットはPNG

をオプションで指定しています。

実際にスクリーンショットを撮ってみた画像は以下の様な形。

*1:朝起きるとやること決まってて便利