CasperJS 不跟随 ASP 网站上的链接答案

【问题标题】：CasperJS doesn't follow link on an ASP siteCasperJS 不跟随 ASP 网站上的链接
【发布时间】：2015-07-23 16:04:07
【问题描述】：

我试图在一个用 ASP 构建的网站上模仿浏览器行为，它似乎使用了很多基于 javascript 的链接和使用 CasperJS 的 UI。我很困惑，不知道下一步该怎么做。

我用的是：casperjs1.1.0-beta3,phantomjs1.9.8，网址是https://icsid.worldbank.org/apps/ICSIDWEB/cases/Pages/AdvancedSearch.aspx

这是我要点击的 HTML 链接：

<td>
    <a href="javascript:__doPostBack('ctl00$m$g_ba040fcb_44f7_44fa_92d0_d088c5679794$ctl00$gvCasedetails','Page$3')">3</a>
</td>

该站点存在一些 SSL 配置问题，因此 CasperJS 运行时需要使用一些额外的标志：casperjs --ignore-ssl-errors=true --ssl-protocol=tlsv1 icsid.js

icsid.js 只是尝试打开站点并单击链接以进入下一页结果。我想检查所有结果。

var casper = require('casper').create({
    clientScripts: ["./jquery.min.js"],
    verbose: true,
    logLevel: 'debug',
    pageSettings: {
        loadImages: false,
        loadPlugins: false,
        userAgent: 'Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/29.0.1547.2 Safari/537.36',
    }
});

casper.start('https://icsid.worldbank.org/apps/ICSIDWEB/cases/Pages/AdvancedSearch.aspx', function(){});

casper.then(function() {
    this.wait(5000);
    this.capture('screenshot0.png');
    casper.then(function(){
        var text = this.evaluate(function(){
            return jQuery('.gdcol a')[0].text;
        });
        console.log('text: ' + text);

        this.evaluate(function(){
            // try to go to second page
            return jQuery('a').filter(function(index) { return $(this).text() === "2"; })[0].click();
        });
    });


    casper.then(function(){
        this.wait(5000);

        var size = this.evaluate(function(){
            return jQuery('.gdcol a').size();
        });
        console.log('size: ' + size);

        // if successfully clicked and changed url, the link text will change
        var text = this.evaluate(function(){
            return jQuery('.gdcol a')[0].text;
        });
        console.log('text: ' + text);

        // if it's still on the first page, this will be null
        var page = this.evaluate(function(){
            return jQuery('a').filter(function(index) { return $(this).text() === "1"; })[0].text;
        });
        console.log('page: ' + page);

        // if it's on the second page, this will be null
        var page = this.evaluate(function(){
            return jQuery('a').filter(function(index) { return $(this).text() === "2"; })[0].text;
        });
        console.log('page: ' + page);

        this.capture('screenshot1.png');
    });
});

casper.run();

这是生成的日志：

[info] [phantom] Starting...
[info] [phantom] Running suite: 3 steps
[debug] [phantom] opening url: https://icsid.worldbank.org/apps/ICSIDWEB/cases/Pages/AdvancedSearch.aspx, HTTP GET
[debug] [phantom] Navigation requested: url=https://icsid.worldbank.org/apps/ICSIDWEB/cases/Pages/AdvancedSearch.aspx, type=Other, willNavigate=true, isMainFrame=true
[debug] [phantom] url changed to "https://icsid.worldbank.org/apps/ICSIDWEB/cases/Pages/AdvancedSearch.aspx"
2015-07-23 11:48:31.255 phantomjs[10699:d13] CoreText performance note: Client called CTFontCreateWithName() using name "Arial" and got font with PostScript name "ArialMT". For best performance, only use PostScript names when calling this API.
2015-07-23 11:48:31.256 phantomjs[10699:d13] CoreText performance note: Set a breakpoint on CTFontLogSuboptimalRequest to debug.
2015-07-23 11:48:31.278 phantomjs[10699:d13] CoreText performance note: Client called CTFontCreateWithName() using name "Arial" and got font with PostScript name "ArialMT". For best performance, only use PostScript names when calling this API.
2015-07-23 11:48:31.279 phantomjs[10699:d13] CoreText performance note: Client called CTFontCreateWithName() using name "Arial" and got font with PostScript name "ArialMT". For best performance, only use PostScript names when calling this API.
2015-07-23 11:48:31.280 phantomjs[10699:d13] CoreText performance note: Client called CTFontCreateWithName() using name "Arial" and got font with PostScript name "ArialMT". For best performance, only use PostScript names when calling this API.
2015-07-23 11:48:31.280 phantomjs[10699:d13] CoreText performance note: Client called CTFontCreateWithName() using name "Arial" and got font with PostScript name "ArialMT". For best performance, only use PostScript names when calling this API.
2015-07-23 11:48:31.479 phantomjs[10699:d13] CoreText performance note: Client called CTFontCreateWithName() using name "Arial" and got font with PostScript name "ArialMT". For best performance, only use PostScript names when calling this API.
2015-07-23 11:48:31.480 phantomjs[10699:d13] CoreText performance note: Client called CTFontCreateWithName() using name "Arial" and got font with PostScript name "ArialMT". For best performance, only use PostScript names when calling this API.
[debug] [phantom] Automatically injected ./jquery.min.js client side
[debug] [phantom] Successfully injected Casper client-side utilities
[info] [phantom] Step anonymous 2/3 https://icsid.worldbank.org/apps/ICSIDWEB/cases/Pages/AdvancedSearch.aspx (HTTP 200)
[info] [phantom] Step anonymous 2/3: done in 1886ms.
[info] [phantom] Step anonymous 3/3 https://icsid.worldbank.org/apps/ICSIDWEB/cases/Pages/AdvancedSearch.aspx (HTTP 200)
[debug] [phantom] Capturing page to /Users/yubrew/app/lib/tasks/screenshot0.png
[info] [phantom] Capture saved to /Users/yubrew/app/lib/tasks/screenshot0.png
[info] [phantom] Step anonymous 3/3: done in 2347ms.
[info] [phantom] Step _step 4/6 https://icsid.worldbank.org/apps/ICSIDWEB/cases/Pages/AdvancedSearch.aspx (HTTP 200)
[info] [phantom] Step _step 4/6: done in 2351ms.
[info] [phantom] wait() finished waiting for 5000ms.
[info] [phantom] Step anonymous 5/6 https://icsid.worldbank.org/apps/ICSIDWEB/cases/Pages/AdvancedSearch.aspx (HTTP 200)
text: ARB/15/30
[info] [phantom] Step anonymous 5/6: done in 7377ms.
[info] [phantom] Step anonymous 6/6 https://icsid.worldbank.org/apps/ICSIDWEB/cases/Pages/AdvancedSearch.aspx (HTTP 200)
size: 50
text: ARB/15/30
page: null
page: 2
[debug] [phantom] Capturing page to /Users/yubrew/app/lib/tasks/screenshot1.png
[info] [phantom] Capture saved to /Users/yubrew/app/lib/tasks/screenshot1.png
[info] [phantom] Step anonymous 6/6: done in 7491ms.
[info] [phantom] Step _step 7/7 https://icsid.worldbank.org/apps/ICSIDWEB/cases/Pages/AdvancedSearch.aspx (HTTP 200)
[info] [phantom] Step _step 7/7: done in 7493ms.
[info] [phantom] wait() finished waiting for 5000ms.
[info] [phantom] Done 7 steps in 12493ms

请注意，屏幕截图和控制台日志表明页面内容没有改变。

【问题讨论】：

标签： javascript click phantomjs casperjs

【解决方案1】：

你不应该使用 Element.click()，因为它在 PhantomJS 中大部分时间都不做任何事情。使用 CasperJS 的 click() 函数来尝试很多方法来正确单击元素。

由于 CSS 选择器不支持基于文本的匹配，您可以使用 XPath 来解决这个问题：

var x = require('casper').selectXPath;
...
casper.click(x("//a[text()='2']"));

您的另一个误解是casper.wait() 实际上做了一些事情。所有then*() 和wait*() 函数都是异步步进函数。当您调用它们时，您只是在安排一个应该在当前步骤结束时执行的步骤。

例如，如果你这样称呼：

this.wait(5000);
this.capture('screenshot0.png');
this.then(function(){...

它是这样执行的：

this.capture('screenshot0.png');
this.wait(5000);
this.then(function(){...

如果可以，您应该将同步函数调用包装在 casper.then() 中。

【讨论】：