AWS EC2 の Ubuntu に GUI を入れてブラウザ操作を自動化する話

こんにちは

これからフロントエンジニアになる予定だけど、バックエンドも、というかクローリングが大好きな僕です。Amazon Web Service を駆使して、効率的かつスピーディーにデータを色々なところから情報を取ってきて、たくさん楽しいことをしたいわけです。

だが、現実はそんなに甘くない

実際にはブラウザを介さないと情報が取れないサイトもたくさんあります。「ちゃんとブラウザでクリックしてくれないと私、データあげないんだから＞＜」的なことを言われるのは日常茶飯事です。（要は javascript）そういう上品なウェブサイトには、ズケズケと土足で踏み込むのではなく、ちゃんと user agent をつけてあげたり、時にはブラウザを介してあげたりして、焦らずゆっくりと(wait() 的な意味で)、丁寧に接してあげなければなりません。

じゃ、ブラウザを使おう

というわけで今回は AWS で立てたサーバを使って、ブラウザを介して世界中からデータを取ってくるための僕の取り組みを紹介します！！

まずサーバを立てよう

まずは、サーバが無いと始まりません。AWS EC2 でサーバを立ててください。
詳しくは「AWS EC2 入門」とかで検索！
ひとまずここでは、下記のような環境が手に入ったと想定します。
ユーザ名: ubuntu
ホスト名: ec2-0-0-0-0.ap-northeast-1.compute.amazonaws.com
サーバに ssh してログインしましょう。

ssh ubuntu@ec2-0-0-0-0.ap-northeast-1.compute.amazonaws.com -i ~/.ssh/xxxxxx.pem

GUI のセットアップ

参考: Cloud Computing Tutorial Blog - ComTechies
ログインしたら、まずは GUI 環境のインストールです。

sudo apt-get update 
sudo apt-get install lxde #GUI のインストール
sudo start lxdm #GUI の起動

これで、デスクトップ環境が立ち上がりました。

リモートデスクトップクライアント用のセットアップ

参考: Ubuntu の VNC サーバー化と Mac との画面共有 - えいちゃダイアリー
次に、先ほど起動した GUI が問題なく動作しているかを確認します。
そのために、手元のパソコンから VNC (Virtual Network Computing) と呼ばれる方法を使って EC2 サーバにログインしてみて、動作を確認してみます。

まずは、VNC でやりとりするためのサーバをインストールして起動しましょう。
起動するときにパスワードを聞かれるので、適当に設定してください。

sudo apt-get install vnc4server
vncserver

標準でもろもろのファイルが出来上がるのですが、このままの設定だと上手く動きません。
ubuntu では X という仮想デスクトップがあるのですが、こちらを使う設定にするためにエイリアスの設定をいじります。
とりあえず、下記のようにやっちゃってください。

rm ~/.vnc/xstartup
ln -s /etc/X11/Xsession ~/.vnc/xstartup

最後に、設定を反映させるために vnc サーバを再起動します。

vncserver -kill :1 #プロセス 1 (先ほど立ちあげたプロセス) を一旦 kill
vncserver #もう一回起動。設定が反映される。

実際に繋げてみよう！

mac ユーザは「画面共有.app」というアプリケーションが標準でインストールされていますので、これを使います。
/System/Library/CoreServices/Screen Sharing.app というところにあるので、 mac の方で（ログイン先の Ubuntu の方じゃないですよ！）、

open /System/Library/CoreServices/Screen Sharing.app

と打つと、起動します。

ここで
vnc://ec2-0-0-0-0.ap-northeast-1.compute.amazonaws.com:5901
を入力し、接続してください。
ちなみに、このときに使うプロトコルは VNC プロトコルというもので、5901 ポートを使います。
詰まりポイントなので、強調しておきますが、必ず AWS の security group の設定で 5901 ポートは解放しておきましょう！！security group のポート解放忘れは設定に詰まって時間を浪費する原因第１位（自分調べ）です！！！

うまくいくと、こんなかんじでデスクトップが見えると思います。

なんか、こうやってデスクトップが見えると、「ああ、僕は時間単位で人様のパソコンを借りてるんだなぁ。」と実感させられます。多分コレは実際にやってみないとわからないです。

ブラウザをインストール

次に、ブラウザをインストールしましょう。ubuntu に戻って、

sudo apt-get install firefox

すると、さくっと firefox がインストールされます。

firefox をプログラムから操作しよう

参考: Ubuntu上でXvfbを使ってJavaScriptのユニットテストをChromeとFirefoxで実行する - Webtech Walker
いよいよ、プログラムから Firefox を操作して、自動化するフェーズに入ります。
言語は Python を使います。
さらに、ブラウザを操作するためのライブラリとして Selenium というものを使います。
Python は適宜インストールしたりアップデートしたりしてください。
次に、pip で Selenium をインストールします。

sudo pip install selenium

仕上げに、使用する仮想ディスプレイを指定する環境変数を設定します。

export DISPLAY=:1

準備が整ったので、早速 Python からブラウザを動かすプログラムを実行してみましょう。
下記のコードを保存して実行してみてください。

#coding: utf8
from selenium import webdriver
driver = webdriver.Firefox()
driver.get(u"http://www.google.co.jp")

実行して、勝手にデスクトップ上に Firefox が立ち上がり、Google のトップページが表示されたら上手く言っています。

標準の状態では日本語のフォントがはいっていないかもしれないので、下記のサイトなどを参考にして適宜インストールしてください。
Ubuntu 12.04インストール時の設定メモ (r271-635)

最後に

以上、Ubuntu の仮想デスクトップでブラウザを介して情報を取得する方法を紹介しました。
いつもルーチンでやっていることだったり、さまざまな単純作業をサーバにやってもらうというのは、とても気持ちのいいことです。
人間の頭をもっと創造的なことに使えますしね。
今回のエントリでは実際のクローラの実装部分には触れていませんが、ここからはぜひ Selenium を駆使した Python コードを書いてもらえればと思います。