SetTimeout в Phantom.js
Ниже приведен код Phantom.js для загрузки страницы, нажмите кнопку и подождите 5 секунд, прежде чем возвращать HTML-код страницы.
Проблема: Однако использование setTimeout()
для создания задержки в 5 секунд вызывает
page.evaluate
возвращает null
функцию обратного вызова вместо HTML.
myUrl = 'http://www.google.com'
var phantom = Meteor.npmRequire('phantom')
phantom.create = Meteor.wrapAsync(phantom.create)
phantom.create( function(ph) {
ph.createPage = Meteor.wrapAsync(ph.createPage)
ph.createPage(function(page) {
page.open = Meteor.wrapAsync(page.open)
page.open(listingUrl, function(status) {
console.log('Page loaded')
page.evaluate = Meteor.wrapAsync(page.evaluate)
page.evaluate(function() {
// Find the button
var element = document.querySelector( '.search-btn' );
// create a mouse click event
var event = document.createEvent( 'MouseEvents' );
event.initMouseEvent( 'click', true, true, window, 1, 0, 0 );
// send click to element
element.dispatchEvent( event );
// Give page time to process Click event
setTimeout(function() {
// Return HTML code
return document.documentElement.outerHTML
}, 5000)
}, function(html) {
// html is `null`
doSomething()
})
})
})
})
Замена setTimeout()
на Meteor.setTimeout()
вызывает другую ошибку:
phantom stdout: ReferenceError: Can't find variable: Meteor
Ответы
Ответ 1
page.evaluate()
- это изолированный контекст страницы PhantomJS. Он не имеет доступа к переменным, определенным снаружи. Если вам нужен тайм-аут, вам нужно сделать два вызова page.evaluate()
, потому что вы не можете вернуть что-либо из асинхронной функции (пояснение):
page.evaluate(function() {
...
element.dispatchEvent( event );
}, function() {
setTimeout(function() {
page.evaluate(function() {
return document.documentElement.outerHTML
}, function(html) {
doSomething()
})
}, 5000)
})
Вместо использования второго вызова page.evaluate()
вы можете сократить код, напрямую обратившись к содержимому, как определено здесь:
setTimeout(function() {
page.get("content", function(content) {
doSomething()
})
}, 5000)
Ответ 2
Это не отличное решение, но работает, если все, что вы хотите сделать, это обрабатывать изменения страницы при нажатии кнопки и отправке форм.
Просто объявите переменные функции вне page.open(), а затем назначьте их функции оценки страницы позже внутри. onLoadFinished будет вызываться после того, как страница перезагрузится с изменениями от нажатия кнопки, а затем вы сможете снова оценить ее.
var loadInProgress = false,
jurl = 'http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js',
page = require('webpage').create();
// declare variables outside page.open and assign them later inside
var evalPageFunc;
// assign callbacks which will be called by phantom
page.onLoadStarted = function() {
loadInProgress = true;
console.log('load started');
};
page.onLoadFinished = function() {
loadInProgress = false;
console.log('load finished');
if (evalPageFunc) {
// since the page has loaded we can safely evaluate it
var mydata = evalPageFunc();
console.log(mydata);
if (!mydata.havemore) {
phantom.exit();
// or next url
}
}
};
page.open(url, function(status) {
page.includeJs(jurl, function(){
// define your page evaluating functions
evalPageFunc = function(){
return page.evaluate(function() {
var datafromhtml = {}, havemoretoclick = true;
// get your data and perform clicks if you want to
// datafromhtml.somedata = $('stealme').text();
// $("clickme").click();
return {
havemore: havemoretoclick,
data: datafromhtml
};
});
}
var k = evalPageFunc();
});
});
Его не очень, но он работает.