トップ > Arch Linux > CasperJSを使ってみる

CasperJSを使ってみる

Arch Linux PhantomJS CasperJS

CasperJS というツールを使ってみたので今回記事にしました。
CasperJS は PhantomJS というヘッドレスブラウザ(GUIなしのブラウザ)の拡張ライブラリで、ブラウザの操作を行ったりキャプチャをとったりできます。主にウェブアプリの自動テストに使用したりするそうです。
参考情報: Wikipedia

環境

ノートPC(OS: Arch Linux)

<余談>
Raspberry Pi に環境を構築する予定でしたが、ラズパイ用 PhantomJS のパッケージがないのでソースからビルドする必要があるらしいです。長時間がかかるそうなので後日設定してみようと思います。

作業手順

  1. PhantomJS のインストール
  2. ChasperJS のインストール

PhantomJS のインストール

<参考文献>
PhantomJSをインストールする

公式サイトよりパッケージをダウンロード。

$ cd /usr/local/src/
$ wget https://bitbucket.org/ariya/phantomjs/downloads/phantomjs-2.1.1-linux-x86_64.tar.bz2

ダンロードファイルを展開し配置する。

$ sudo tar xvf phantomjs-2.1.1-linux-x86_64
$ sudo ln -s phantomjs-2.1.1-linux-x86_64 phantomjs
$ sudo ln -s /usr/local/src/phantomjs/bin/phantomjs /usr/local/bin/phantomjs

インストールの確認。

$ phantomjs -v
2.1.1

CasperJS のインストール

<参考文献>

WEB

公式サイト

書籍

JS+Node.jsによるWebクローラー/ネットエージェント開発テクニック

公式サイトの手順に従ってインストールする。

$ cd /usr/local/src
$ git clone git://github.com/casperjs/casperjs.git
$ ln -s casperjs/bin/casperjs /usr/local/bin/casperjs

インストールの確認。

$ casperjs --version
1.1.3

動作確認

グーグルトップページの全アンカータグのURLを取得するプログラムを作成してみます。

ソースコード
// getAnchors.js

var casper = require('casper').create();

// グーグルにアクセスする。
casper.start('http://www.google.com', function() {
    // ページのタイトルを表示する。
    this.echo(this.getTitle());
});

//アクセス後、ページの全アンカータグのURLを取得する。
casper.then(function() {
    // 全アンカータグを取得
    var hrefs = this.evaluate(function() {
        var alist =  document.querySelectorAll("a");
        var hrefList = [];
        for (var i=0; i<alist.length; i++) {
            hrefList.push(alist[i].href);
        }
        return hrefList;
    });
    // アンカータグのURLを表示する。
    for (var i in hrefs) {
        this.echo(hrefs[i]);
    }
});

casper.run();
プログラム実行
$ casperjs getAnchors.js
Google
https://plus.google.com/?gpsrc=ogpy0&tab=wX
https://www.google.co.jp/webhp?tab=ww
...

プログラム解説

「start(URL, 処理)」で「URL」のページへアクセスします。

そして、アクセス後の処理は「then(処理)」を使って作成します。
「casper.then(); casper.then(); ...」と実装していくことで、ブラウザ操作を順次実行することができます。

DOM操作を実装するには、「evaluate(処理)」を使います。evaluate関数内にコードを書き、関数の戻り値からセレクタの情報を拾います。

上記のようなコードが、CasperJSの基本的な実装のようです。

後書き

今回はノートPC環境で CasperJS の実装を行いましたが、Raspberry Pi で実行できるように環境を整えて行きたいです。