PhantomJSのメモいろいろ

ハマったとこ、先人の知恵のまとめ。

提供されるモジュール群は5つ

phantom: そのもの
FileSystem: ファイルに出力したり、依存ファイルの存在確認したり
System: コマンドラインから引数取りたいなら
WebPage: きっと主役なrequire('webpage').create()するやつ
WebServer: まだ使わない方がよさそう

おおまかな使い方は2パターン

pageを使いまわす

オーソドックスなやつかと。
PhantomJSのサンプルといえば！的な。

var page = require('webpage').create();

page.open('http://example.com', function(){
  // do something..
  page.evaluate(function(){
    // do something...
  });
  phantom.exit();
});

コールバックに載せまくる

ネットワークの監視とか。

var page = require('webpage').create();

page.onResourceRequested = function (request) {
  console.log('Request ' + JSON.stringify(request, undefined, 4));
};
page.onResourceReceived = function (response) {
  console.log('Receive ' + JSON.stringify(response, undefined, 4));
};
page.open(url);

とにかくいろいろサンプルあるので、先に見るとイメージがつかめるかもです。

参考：phantomjs/examples at master · ariya/phantomjs · GitHub

page.evaluate()に任意の引数を与えたい

Evaluates the given function in the context of the web page. The execution is sandboxed, the web page has no access to the phantom object and it can't probe its own setting.

それは困った。

// NG!
var url = 'http://example.com',
  idPw = {
    id: 'hoge',
    pw: 'piyo'
  };

page.open(url, function(){
  page.evaluate(function(){
    document.getElementById('login-name').value = idPw.id; // Undefined!!
    document.getElementById('pass-word').value = idPw.pw; // Undefined!!
    document.getElementById('myForm').submit();
  });
});

これは困った・・。

evaluate(function, arg1, arg2, ...)

// OK!
var url = 'http://example.com',
  idPw = {
    id: 'hoge',
    pw: 'piyo'
  };

page.open(url, function(){
  page.evaluate(function(idPw){
    document.getElementById('login-name').value = idPw.id;
    document.getElementById('pass-word').value = idPw.pw;
    document.getElementById('myForm').submit();
  }, idPw); // 渡せた！
});

UserAgentを偽装する

やり方は2通り。
推奨されてるのは最初のやつだそうな。

page.settingsに設定

// var page …

page.settings = {
  userAgent: 'Mozilla/5.0 (iPhone; CPU iPhone OS 6_0 like Mac OS X) AppleWebKit/536.26 (KHTML, like Gecko) Version/6.0 Mobile/10A403 Safari/8536.25'
};

// page.open(…

page.customHeadersに設定

// var page …

page.customHeaders = {
  User-Agent: 'Mozilla/5.0 (iPhone; CPU iPhone OS 6_0 like Mac OS X) AppleWebKit/536.26 (KHTML, like Gecko) Version/6.0 Mobile/10A403 Safari/8536.25'
};

// page.open(…

この方法で設定すると、最初の方法を上書きしてしまうそうです。

ログイン処理するならライブラリ併用が無難

参考：uu59のメモ | phantomjsでadplannerの表示を見る

ログインした後のリダイレクト待ちとか、そもそも重いページとか、単純なコールバックで上手くいかない時とか。
ここに書かれてる内容で、やりたいことのほとんどはできるのではないでしょうか。

あとはflow.jsとか。

参考：uupaa/flow.js · GitHub

ページへは、

if(!phantom.injectJs('./utils/jsdeferred.js')){
  console.log('This script requierd jsdefferred.js!');
  phantom.exit(1);
}

という具合で差し込めば使えます。

書式やスタイルはNode.jsと同じ

まぁ当たり前ですが・・。
コールバックの嵐になりがちなあたりや、CommonJSスタイルでのモジュール読み込みとか。

というかCasperJS

PhantomJSのAPIをいろいろ調べるとか、するより先に、コレ使ったほうが早いし楽です。
おそらくスクレイピング絡みのほとんどのことは、難なく実現できちゃいます。

CasperJSのメモとか、作ったサンプルはまた個別の記事で載せようと思います。