某所に置いてあるJavaScript製暗号(ソースだと暗号、でもJSとして扱うと単なる文字列)をスクリプトに取り込むため、CUIベースのJavaScript動作環境を確認した。最近よくみるNode.jsにしようかと思ったけど、どうも用途に合わない&デカすぎる。ということでもう少し調べたところ、PhantomJSというのを知りました。WebKit系なのもちょっとうれしい。
PhantomJS is a headless WebKit scriptable with a JavaScript API. It has fast and native support for various web standards: DOM handling, CSS selector, JSON, Canvas, and SVG.
PhantomJS - Scriptable Headless Browser
今回の用途としてはJavaScriptさえ動いてくれれば良いのですが、当然ながらPhantomJSを動かすための構文があるのでそれを確認してました。
参考サイト
本山。
きれいにまとめられており、ヘルプとして使える。
PhantomJSの説明として簡潔かつ明解。
こちらもPhantomJSの説明が非常に分かりやすい。しかも発展的内容がある。
PhantomJSのキモであるpage.evaluateの説明が詳細。
構文1・2
構文1
var page = require('webpage').create();
この構文でWebサイト取得の準備をする。
構文2
open(URL) URLを開いてWebページをロードする。コールバック関数の指定はオプション(ページロードのステータスが渡される)。 http://kinakomochi.6.ql.bz/?PhantomJS%E3%81%AE%E4%BD%BF%E3%81%84%E6%96%B9#xa2767ee
例
var page = require('webpage').create(); page.open('http://example.com', function () { page.render('example.png'); phantom.exit(); }); https://github.com/ariya/phantomjs/wiki/Quick-Start#page-loading
Webサイト'http://example.com'を取得して画像ファイルとして出力(Headlessですがイメージを取れる)。
構文3
evaluate(function) 指定された関数をWebページのコンテキストで実行する。 http://kinakomochi.6.ql.bz/?PhantomJS%E3%81%AE%E4%BD%BF%E3%81%84%E6%96%B9#xa2767ee
つまり本当にやりたいことはこのfunction部分に書く。
例
var page = require('webpage').create(); page.open(url, function (status) { var title = page.evaluate(function () { return document.title; }); console.log('Page title is ' + title); }); https://github.com/ariya/phantomjs/wiki/Quick-Start#code-evaluation
例2
var page = require('webpage').create(); page.open('http://example.com', function (status) { if (status !== 'success') { console.log('Unable to access the URL!'); } else { page.evaluate(function () { // document.body を使ってあれこれ }); } phantom.exit(); }); http://ja.stackoverflow.com/a/5077/4114
注意点
evaluateメソッドはWeb Pageのコンテキストで評価されます。
この実行はサンドボックス化されているため、PhantomJSと直接やりとりできません。
evaluateメソッドの中で(コールバックの無名関数内で)
Web Pageのコンテキストで評価されるため、ターミナルに結果は出力されません。
consoleオブジェクトが、Web Page上のconsoleオブジェクトとして解釈されてしまうためです。
PhantomJSでは、Web PageオブジェクトのコールバックメソッドonConsoleMessageを使うことで、この問題を解決できます。
(引用時に一部略)
http://murayama.hatenablog.com/entry/2013/06/24/065633
(すみませんCoffeeScriptはほとんど読めないので理解してませんm(_ _)m)
構文4
jQueryなど外部JSの利用
- 外部 JS の利用
DOM 操作も jQuery を利用できたほうが楽ですよね。includeJs を使うと外部の JS を読み込んで、それを evaluate 内で使用することができます。
http://d.hatena.ne.jp/hecomi/20121229/1356785834
includeJs(URL, callback) 外部ファイルを指定URLから読み込みコールバックを実行する。
injectJs(filename) 外部ファイルをlibraryPathから読み込む(成功時はtrue、それ以外はfalseで終了)。
http://kinakomochi.6.ql.bz/?PhantomJS%E3%81%AE%E4%BD%BF%E3%81%84%E6%96%B9#xa2767ee
てなことで
先人に感謝(-人-)。
間違った理解による引用があるおそれもございますご注意ください。