如何在phantomJS中执行jQuery promise?

时间:2013-03-08 13:35:50

标签: jquery node.js phantomjs

我正在尝试在服务器端使用nodejs和phantomjs来搜索我们网站的SEO。虽然ajax工作正常,但我无法执行我在代码中使用的自定义承诺。如何让phantomJS等到承诺得到解决。 以下是我编码的内容。

$('body').addClass('before-dom-ready');

$(function() {
    $('body').addClass('after-dom-ready');

    var dfrd = $.Deferred(),
            promise = dfrd.promise();

    setTimeout(function() {
        dfrd.resolve();
    }, 5000);

    promise.done(function() {
        $('body').addClass('promise-executed');
    });

});

phantomJS增加了'before-dom-ready'和'after-dom-ready'课程,但是我无法在课堂上获得'承诺执行'课程。

1 个答案:

答案 0 :(得分:4)

PhantomJs不会自动等待所有挂起脚本的结束。在onload事件上调用WebPage#onLoadFinished。

至于大多数脚本,这里的想法是等到“某事”完成或真实。 我强烈建议你测试waitfor.js。在PhantomJs中理解这个例子非常重要。

我想你的例子就是一个例子,但让我提出一个答案。

Html Page

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.10.0.min.js"></script>
    <title>Test</title>
</head>
<body id="body">

    <script type="text/javascript">
        //alert('hello');
        $('body').addClass('before-dom-ready');

        $(function () {
            $('body').addClass('after-dom-ready');

            var dfrd = $.Deferred(),
                    promise = dfrd.promise();

            setTimeout(function () {
                dfrd.resolve();
            }, 5000);

            promise.done(function () {
                $('body').addClass('promise-executed');
                $('body').text('Hello World !');
            });

        });
    </script>
</body>
</html>

PhantomJs脚本

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

function waitFor(testFx, onReady, timeOutMillis) {
    var maxtimeOutMillis = timeOutMillis ? timeOutMillis : 10000, //< Default Max Timout is 10s
        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");
                    typeof (onReady) === "string" ? eval(onReady) : onReady();
                    clearInterval(interval);
                    //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
                }
            }
        }, 500); //< repeat check every 500ms
};

if (system.args.length != 1) {
    console.log('invalid call');
    phantom.exit(1);
} else {
    //adapt url to your context
    page.open('http://localhost:9231/demo.html', function (status) {
        if (status !== 'success') {
            console.log('Unable to load the address!');
            phantom.exit();
        } else {
            waitFor(
                function () {
                    return page.evaluate(function () {
                        return $('body').hasClass('promise-executed');
                    }) > 0;
                },
                function () {
                    page.render('page.png');
                    phantom.exit();
                }, 10000);
        }
    });
}

基本上,如果正文有一个名为waitFor的类,'promise-executed'将每500毫秒检查一次。