Casperjs ajax调用 - waitForResource和解析错误

时间：2015-03-18 23:01:53

标签： javascript ajax casperjs

Casperjs是一个很棒的工具。我已经能够理解某些基础知识。但是，我正在努力解决两个问题。首先，为了关闭原因，我将代码分成几个函数。我得到一个解析错误。我已将选项添加到verbose: true, logLevel: "debug"，看看它是否指出了行号，但我没有得到任何结果。其次，我想做一个异步的ajax调用。我正在使用waitFor但我读了THIS文章以获得更有效的方法。如何设置waitForResource()来跟踪AJAX请求？以及如何显示解析错误行？

CODE 

var urls = ['http://9gag.tv/'];
var casper = require('casper').create({
    verbose: true,
    logLevel: "debug"
});

function getNumberOfItems(casper) {
    return casper.getElementsInfo(".listview .badge-grid-item").length;
}

function tryAndScroll(casper) {
  casper.page.scrollPosition = { top: casper.page.scrollPosition["top"] + 4000, left: 0 };
  var info = casper.getElementInfo('.badge-post-grid-load-more');
  if (info.visible) {
    var curItems = getNumberOfItems(casper);
    if( curItems <= 60 ) {
        casper.waitFor(function check(){
          return curItems != getNumberOfItems(casper);
        }, function then(){
          tryAndScroll(this);
        }, function onTimeout(){
          this.echo("Timout reached");
        }, 10000);
    }
  } else {
    casper.echo("no more items");
  }

}

function combineArrays(x, y) {
    var result = [];
    for(var i = 0, i < page_links.length; i++) {
        result[i] = {};
        result[i].page_link = x[i];
        result[i].video_link = y[i];
    }
    return result;
}

function linkScraper(x){
    var page_links = [];
    var youtube = [];
    for (var i = 0; i < x.length; i++)
    { // start for loop
        casper.thenOpen(x[i], function() {
            //Scroll down for elements
            tryAndScroll(this);
            casper.then(function() {
              this.getElementsInfo('.title').forEach(function(element) {
                // skip elements that don't have a href attribute...
                if (!element.attributes.href) {
                  return;
                }
                page_links.push( element["attributes"]["href"] );
                casper.thenOpen(element.attributes.href, function() {
                  this.click('.responsivewrapper');
                }).then(function(){
                  casper.each(this.getElementsInfo('.badge-youtube-player'), function(casper, element, j) {
                    youtube.push( element["attributes"]["src"] );
                  });
                })localhost;
              });
            });
        });
    }
    return combineArrays(page_links,youtube);
}

function stringifyResult(webpages){
    //Pass link array to linkScraper
    var linksArr = linkScraper.call(this, webpages);
    //send results to php page
     server = "http://localhost:8181/hashtag_pull/lib/9GagPrivateApi.php";
     this.waitFor( function() {
         response = this.evaluate(function() {
            $.ajax({
                type: "POST",
                url: server,
                data: JSON.stringify(linksArr),
                //dataType: 'json',
                contentType: "application/json",
                success: function (data) {
                    this.echo("All done.");
                    return this.exit();
                    //return data.responseText;
                },
                error: function (xhr,status,error){
                    return this.echo(error);
                }
            });
         });
     });
}



casper.start().then(function() {
    this.echo("Starting");
});
casper.userAgent('Mozilla/5.0 (Macintosh; Intel Mac OS X)');
casper.run(stringifyResult.call(this, urls));

1 个答案:

答案 0 :(得分：7)

您的代码存在许多问题。

1。语法错误

CasperJS和PhantomJS本身不会显示语法错误的位置，但它可能在行for(var i = 0, i < page_links.length; i++) {中。将,更改为;。并且此行中未定义page_links。你可能意味着x 对于未来：CasperJS脚本是纯JavaScript。您可以使用jslint.com等在线工具查找此类错误（以及代码的其他问题）。

还有一个错位localhost。

2。 this

this具有多种含义，具体取决于放置位置。

a）全球this

以最后一行为例：

casper.run(stringifyResult.call(this, urls));

此this不在所有功能之内。所以它引用window（是的，有两个单独的window个对象，一个在页面上下文中，一个在外部）。它没有提到您可能期望的casper。使用：

casper.run(stringifyResult.call(casper, urls));

（^非最终代码：见6。）

b）jQuery回调

this内部：

success: function (data) {
    this.echo("All done.");
    return this.exit();
},

指的是jQuery的jqXHR对象（顺便说一句，你也不能从函数内的异步函数返回一些东西）。它与CasperJS无关。此外，不可能从页面上下文（casper.evaluate()）内部调用CasperJS函数，因为页面上下文是沙箱。它无法访问外部定义的变量（包括linksArr和server）。有关详细信息，请参阅this。

3。不必要的waitFor

您的waitFor永远不会完成，但您可能是这样设计的，以便发送您的AJAX请求。问题是每隔20毫秒就会发送相同的破坏请求。

4。发送AJAX请求

CasperJS提供了一个实用程序，用于在页面上下文中发送AJAX请求：__utils__.sendAJAX()。它还默认阻止执行，因此不需要以越界的方式等待请求。

function stringifyResult(webpages){
    var linksArr = linkScraper.call(this, webpages);

    //send results to php page
    server = "http://localhost:8181/hashtag_pull/lib/9GagPrivateApi.php";
    this.evaluate(function(server, linksArr){
        __utils__.sendAJAX(server, "POST", JSON.stringify(linksArr));
    }, server, linksArr);
}

（^非最终代码：见5.）

5。从异步函数返回

所有then*和wait* CasperJS函数都是异步的。通过调用它们，可以安排在当前步骤结束时执行相关步骤。

这意味着您无法从linkScraper返回内容，因为它包含异步代码。或者至少你不能返回最终结果，因为它们由异步代码填充。但是，您可以返回最终将包含结果的数组。

一种可能的解决方法是将合并调用移到linkScraper之外：

function linkScraper(x){
    var page_links = [];
    var youtube = [];
    // here are asynchronous calls
    return {pl: page_links, yt: youtube};
}
function stringifyResult(webpages){
    var linksObj = linkScraper.call(this, webpages);
    // here linksObj contains empty lists
    this.then(function(){
        // here linksObj contains populated lists
        var linksArr = combineArrays(linksObj.pl, linksObj.yt);

        server = "http://localhost:8181/hashtag_pull/lib/9GagPrivateApi.php";
        this.evaluate(function(server, linksArr){
            __utils__.sendAJAX(server, "POST", JSON.stringify(linksArr));
        }, server, linksArr); 
    });
}

6。 exit

casper.exit()是即时的。所以当你调用它时，执行就会停止。你在打电话时一定要小心，因为可能会有计划的步骤。

有一种方法可以避免通过不向casper.exit()提供回调来调用casper.run()。如果您提供此类回调，则在执行所有步骤时将不会自动退出。

casper.then(stringifyResult.call(casper, urls)).run();
相关问题
最新问题