PhantomJS 和 CasperJS 不加载 JS答案

【问题标题】：PhantomJS and CasperJS not loading JSPhantomJS 和 CasperJS 不加载 JS
【发布时间】：2023-04-01 22:20:01
【问题描述】：

我已阅读此phantomjs not waiting for "full" page load，但它并没有解决我的问题。

我试过这个（我的 html，不是完整的）：

<div id="test"></div>


<script>
    window.onload = function() {
        document.getElementById('test').innerHTML = 'something';
        console.log('page loaded');
    };
</script>

这在我的 js 中：

var page = require('webpage').create();

page.onConsoleMessage = function(msg) {
    console.log('here i am');
};
page.onLoadFinished =  function() {
    console.log('or here!');
}
page.open('http://localhost:3456/calculatorfixture.html', function (status) {
    waitFor(function _test(){
        return page.evaluate(function() {
            return document.getElementById("test").innerHTML == "something";
        });
    }, function _onReady(){
        console.log ("DONE");
        phantom.exit();
    });
});

我也在截屏 - 仍然没有。我无法让任何 JS 在我的页面上工作。我错过了什么？

【问题讨论】：

标签： javascript phantomjs casperjs

【解决方案1】：

问题是您的 JS 中缺少 waitFor() 函数。我不认为它是 PhantomJS 内置的——它在 waitfor.js 示例代码中列出。一旦我将它添加到 JS 文件中，就在 require 语句之后，我得到了以下输出：

here i am
or here!
'waitFor()' finished in 500ms.
DONE

waitFor() 代码：

/**
 * Wait until the test condition is true or a timeout occurs. Useful for waiting
 * on a server response or for a ui change (fadeIn, etc.) to occur.
 *
 * @param testFx javascript condition that evaluates to a boolean,
 * it can be passed in as a string (e.g.: "1 == 1" or "$('#bar').is(':visible')" or
 * as a callback function.
 * @param onReady what to do when testFx condition is fulfilled,
 * it can be passed in as a string (e.g.: "1 == 1" or "$('#bar').is(':visible')" or
 * as a callback function.
 * @param timeOutMillis the max amount of time to wait. If not specified, 3 sec is used.
 */
function waitFor(testFx, onReady, timeOutMillis) {
    var maxtimeOutMillis = timeOutMillis ? timeOutMillis : 3000, //< Default Max Timout is 3s
        start = new Date().getTime(),
        condition = false,
        interval = setInterval(function() {
            if ( (new Date().getTime() - start < maxtimeOutMillis) && !condition ) {
                // If not time-out yet and condition not yet fulfilled
                condition = (typeof(testFx) === "string" ? eval(testFx) : testFx()); //< defensive code
            } else {
                if(!condition) {
                    // If condition still not fulfilled (timeout but condition is 'false')
                    console.log("'waitFor()' timeout");
                    phantom.exit(1);
                } else {
                    // Condition fulfilled (timeout and/or condition is 'true')
                    console.log("'waitFor()' finished in " + (new Date().getTime() - start) + "ms.");
                    typeof(onReady) === "string" ? eval(onReady) : onReady(); //< Do what it's supposed to do once the condition is fulfilled
                    clearInterval(interval); //< Stop this interval
                }
            }
        }, 250); //< repeat check every 250ms
};

【讨论】：

您应该更新您的问题以显示完整的代码以及预期的输出。如果我的本地测试给出正确的结果，我倾向于认为您的配置存在另一个问题。您是否验证了 localhost:3456/calculatorfixture.html 的内容、行为和缺少 JS 错误？尝试将其简化为基本要素并再次测试。

【解决方案2】：

如果没有完全复现，问题有点难看，我建议你试试现成的工具吗？（免责声明：我做了那个小图书馆）。有一个waitFor内置https://github.com/javascriptlove/haunt

var page = require('./build/haunt.js');

page.create({ 
        log: true,
        userAgent: 'Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/41.0.2228.0 Safari/537.36' 
    })
    .get('http://example.com')
    .waitFor(function() {
        return document.getElementById("test").innerHTML == "something";
    })
    .then(function() {
        // other stuff you want to do, this.page refers to the phantom's page object
    })
    .end();

【讨论】：