Question

我试图用PhantomJS从http://my.playstation.com/logged-in/trophies/public-trophies/

中抽取奖杯数据

该页面要求您输入有效的用户名，然后单击“开始”，页面将加载数据。我已经让这个工作有点，但它永远不会将奖杯数据加载到div。我希望我能错过ajax相关的东西导致这个？

  var fullpagehtml = page.evaluate(function() 
  {
        document.getElementById("trophiesId").value = "<<valid user id>>";
        //checkPTrophies(); btn click calls this function
        $('#btn_publictrophy').click().delay( 6000 );

        console.log("\nWaiting for trophy list to load...");
        var trophylist = document.getElementById("trophyTrophyList").innerHtml; // all the data i want ends up inside this div
        var counter = 0; //delay andset timeout wont work here so this is the best i coukld think of
        while (trophylist == null)
        {
            //presumably the ajax query should kick in on the page and populate this div, but it doesnt.
            trophylist = document.getElementById("trophyTrophyList").innerHtml;
            counter ++;
            if(counter == 1000000)
            {
                console.log($('#trophyTrophyList').html());
                counter = 0;
            }
        }
        return document.all[0].outerHTML;

  });

Answer 1

delay( 6000 )完全没有，因为documentation说：

.delay()方法最适合延迟排队的jQuery效果。因为它是有限的 - 例如，它没有提供取消延迟的方法 - .delay()不能取代JavaScript的原生setTimeout功能，这可能更多适用于某些用例。

等待你必须在页面上下文之外执行此操作（繁忙的等待不能在JavaScript中工作，因为它是单线程的）：

page.evaluate(function() {
    document.getElementById("trophiesId").value = "<<valid user id>>";
    //checkPTrophies(); btn click calls this function
    $('#btn_publictrophy').click();
});

console.log("\nWaiting for trophy list to load...");
setTimeout(function(){
    var fullpagehtml = page.evaluate(function() {
        var trophylist = document.getElementById("trophyTrophyList").innerHTML;
        return trophylist;
    });
}, 20000);

您还可以使用waitFor等待填充#trophyTrophyList而不是setTimeout：

waitFor(function(){
    return page.evaluate(function(){
        var e = document.getElementById("trophyTrophyList");
        return e && e.innerHTML;
    });
}, function(){
    // TODO: get trophies
});

这不会让你走得太远，因为只是因为加载了#trophyTrophyList，并不意味着后代元素已经存在于DOM中。您必须找到一些选择器，表示页面已充分加载，例如等待页面中存在.trophy-image。它适用于waitFor函数的20秒超时。

waitFor(function(){
    return page.evaluate(function(){
        var e = document.querySelector("#trophyTrophyList .trophy-image");
        return e;
    });
}, function(){
    setTimeout(function(){
        var trophiesDiv = page.evaluate(function(){
            return document.getElementById("trophyTrophyList").innerHTML;
        });
        console.log(trophiesDiv);
    }, 1000); // wait a little longer
}, 20000);

不要忘记您需要page.evaluate才能真正访问DOM。顺便说一句，它是innerHTML而非innerHtml。

从官方Playstation网站刮取奖杯数据

1 个答案: