setTimeout w Phantom.js

Question

Poniższy kod chce, aby Phantom.js załadował stronę, kliknął przycisk i odczekał 5 sekund, zanim zwróci kod HTML strony.

problemu: Jednakże stosując setTimeout() tworzyć opóźnienie 5 sekund powoduje funkcję page.evaluate powrotu null do funkcji połączenia zwrotnego zamiast 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() 

      }) 
     }) 
    }) 
}) 

Wymiana setTimeout() z Meteor.setTimeout() powoduje kolejny błąd:

phantom stdout: ReferenceError: Can't find variable: Meteor 

Answer 1

page.evaluate() jest piaskownicy kontekst strona PhantomJS. Nie ma dostępu do zmiennych zdefiniowanych na zewnątrz. Jeśli potrzebujesz limit czasu, to trzeba zrobić dwa połączenia do page.evaluate(), ponieważ nie można niczego powrócić z asynchronicznego funkcji (explanation):

page.evaluate(function() { 
    ... 
    element.dispatchEvent(event); 
}, function() { 
    setTimeout(function() { 
     page.evaluate(function() {  
      return document.documentElement.outerHTML 
     }, function(html) { 
      doSomething() 
     }) 
    }, 5000) 
}) 

Zamiast drugiego page.evaluate() połączenia, można skrócić kod przez bezpośredniego dostępu do treści zdefiniowanego here:

setTimeout(function() { 
    page.get("content", function(content) { 
     doSomething() 
    }) 
}, 5000) 

Answer 2

nie jest to świetne rozwiązanie, ale działa, jeśli wszystko, co chcesz zrobić, to uchwyt zmiany stron na kliknięcie przycisku i forma podnosi. Po prostu zadeklaruj zmienne funkcji poza page.open(), a następnie przypisz im później funkcje oceny strony. Funkcja onLoadFinished zostanie wywołana po ponownym załadowaniu strony ze zmianami z kliknięcia przycisku, a następnie można ją ponownie ocenić.

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(); 
    }); 
}); 

To nie jest ładne, ale działa.