モロ屋

アキバではたらくWebエンジニア。JavaScript / AWS / Mac

画面のないブラウザ、PhantomJSを試してみる

PhantomJS

PhantomJS: Headless WebKit with JavaScript API

WebKitのヘッドレスブラウザ、つまり画面がないコマンドラインのみのブラウザといったところです。

画面がないブラウザとか意味ねーだろってところですが、簡単なコードでブラウザで出来る処理ならなんでも出来るので使い所は結構ありそうですね。

スクリーンショットを自動生成したい

サイトのスクリーンショットを生成したい! でも既存サービスは重かったり更新が遅かったりしたので自前で用意するか! ってことでPhantomJSを使ってみます。

MacにHomebrewでインストール
$ brew install phantomjs

Homebrewが入っていれば一発でインストールされます。

とりあえず試してみる
$ phantomjs screenshot.js http://www.aikatsu.net/ ~/aikatsu.jpg 500

結果

f:id:molov2:20130509005709j:plain

スクリーンショットは撮れましたが、ポップアップが出ているのでこれを消したいところです。

そこで、ページを開いたあとに左上1pxのところをクリックさせて、ポップアップを消してからスクリーンショットを取ります。

特定の座標でイベントを起こすにはこんな感じで

page.sendEvent('click', 1, 1);

と、簡単すぎですね〜

f:id:molov2:20130509005702j:plain

あとはImageMagickでもGDでも使ってサムネイル化すれば終わりかな。

Mac環境だとフォント入ってるのに、まだ日本語文字化けしてますね。なんでだろ。