Question

我正在尝试使用CasperJS刮取this page左侧边栏上的链接。

该页面在侧栏中有数百个链接，但在向下滚动时一次只能加载20个。这段代码成功地抓住了前20个（需要全局安装的casperjs和phantomjs才能运行）：

var casper = require('casper').create();
// helper function that gets all of the resume links on the page:

  var getAllLinks = function() {
    var linksOnThisPage = []
    $("a[href^='/ResumeB']").each(function(index, linkDiv) {
      $linkDiv = $(linkDiv)
      linksOnThisPage.push('http://www.super-resume.com' + $linkDiv.attr('href'))
    });
   return linksOnThisPage
  };

//start casper, go  to page, run helper function:
casper.start('http://www.super-resume.com/ResumeBuilder.jtp?query=Database+Administrator', function() {
  allLinks=casper.evaluate(getAllLinks)
  console.log('number of links found:', allLinks.length);
});

casper.run();

我可以在实际的浏览器中向下滚动页面：

$('#search-left-inner').scrollTop(10000);

10000是一个任意大的数字;每次在浏览器中运行该代码时，它都会加载20多个链接。（理想情况下，我希望能够一次抓住所有内容，而不必一次重新加载20个，但现在这样做不那么紧迫了。）如果我将该行放在getAllLinks函数中，如下所示：

var getAllLinks = function() {
    $('#search-left-inner').scrollTop(10000);

    var linksOnThisPage = []
    //etc, etc,

它仍然只加载20个链接。许多类似的帖子讨论了同步性问题，所以我试图让它等待侧边栏完成加载几种方式，包括：

var getAllLinks = function() {
    casper.then(function () {
        $('#search-left-inner').scrollTop(100000);
    });
    casper.then(function () {

    var linksOnThisPage = []
    //etc. etc.
}

但现在由于某种原因它只找到一个链接而不是20个。

Answer 1

我认为如果滚动，它不会立即加载下一个项目，因为加载需要时间。你需要在滚动之后稍等一下才能尝试再次刮掉所有元素。

casper.start(url)
    .thenEvaluate(scroll)
    .wait(5000, function(){
        var links = this.evaluate(getAllLinks);
        this.echo(links.length);
    })
    .run();

如果这会生成更多链接，那么您可以尝试下一步，即无限滚动，直到没有加载新元素。这可以通过CasperJS中的异步递归来完成：

var linkCount = -1;

function getAllLinks() {
    var linksOnThisPage = []
    $("a[href^='/ResumeB']").each(function(index, linkDiv) {
        $linkDiv = $(linkDiv)
        linksOnThisPage.push('http://www.super-resume.com' +   $linkDiv.attr('href'))
    });
    return linksOnThisPage
}

function scroll() {
    $('#search-left-inner').scrollTop(10000);
}

/**
 * Returns true if more elements were loaded that were before
 */
function checkMore(){
    var newLinks = this.evaluate(getAllLinks);
    var newCount = newLinks.length;
    if (linkCount === -1) {
        linkCount = newCount;
    }
    return linkCount < newCount
}

/**
 * Executes the a single iteration step and waits for a change in numbers.
 * Terminates if there are no changes in 6 seconds.
 */
function step(){
    this.thenEvaluate(scroll)
        .waitFor(check, step, function _onTimeout(){
            var links = this.evaluate(getAllLinks);
            this.echo("finished with " + links.length + " links\n\n"+links.join("\n"));
        }, 6000);
}

casper.start(url, step).run();

请记住，在casper.evaluate()内部的DOM上下文（页面上下文）中使用jQuery是唯一有意义的。我建议您也阅读该功能的PhantomJS documentation。

从CasperJS

1 个答案: