phantomjsでウェブページの特定箇所のキャプチャ
取得したい領域の位置(X,Y,縦,横)を取得してキャプチャを取得。
(macであればbrew install phantomjsで簡単にインストール可能)
sample.js
var page = require('webpage').create();
var clipUrl = 'http://www.****.com/*****';
var imageName = 'capture.png';
page.open(clipUrl, function(status) {
if (status !== 'success') {
console.log('Unable to load the address!');
} else {
setTimeout(function(){
var clipRect = page.evaluate(function () {
var imageClassName = 'classname';
// document.querySelector('.viewSide').click();
// document.querySelector('.changeRandom').click();
return document.getElementsByClassName(imageClassName)[0].getBoundingClientRect();
});
page.clipRect = {
top: clipRect.top,
left: clipRect.left,
width: clipRect.width,
height: clipRect.height
};
page.render(imageName);
phantom.exit();
},5000);
}
});
後は、ローカルから
phantomjs sample.js
特にsetTimeoutは無くてもよいが、サイトによっては表示がでそろうまでに時間がかかる場合があるため。
(コメント部分はなんらかの画面の部品をクリックした上でデータを取りたい場合に操作)