Question

我已经阅读了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在我的页面上工作。我错过了什么？

Answer 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
};

Answer 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();

PhantomJS和CasperJS没有加载JS

2 个答案: