Phantom Js图像捕捉问题

Question

我是幻影js的新手。我正在使用幻影js来创建网页图像。它适用于普通网页，但滚动后加载内容的网页无法正确捕获。

我使用以下代码生成图像：

PhantomJs Code（Desktop.js）：

var page = require('webpage').create(),
    system = require('system'),
    address, output, size;

if (system.args.length < 3 || system.args.length > 5) {
    console.log('Usage: rasterize.js URL filename [paperwidth*paperheight|paperformat] [zoom]');
    console.log('  paper (pdf output) examples: "5in*7.5in", "10cm*20cm", "A4", "Letter"');
    phantom.exit(1);
} else {
    address = system.args[1];
    output = system.args[2];
    page.viewportSize = { width: 1280, height:200 };
    if (system.args.length > 3 && system.args[2].substr(-4) === ".pdf") {
        size = system.args[3].split('*');
        page.paperSize = size.length === 2 ? { width: size[0], height: size[1], margin: '0px' }
                                           : { format: system.args[3], orientation: 'portrait', margin: '1cm' };
    }
    if (system.args.length > 4) {
        page.zoomFactor = system.args[4];
    }
    page.open(address, function (status) {
        if (status !== 'success') {
        console.log("status: " + status);
            console.log('Unable to load the address!');
            phantom.exit();
        } else {
            window.setTimeout(function () {
            page.render(output);
                phantom.exit();
           }, 3000);
        }
    });
}

CakePhp代码：

$phantomjs_path = '/var/www/html/phantomjs/';
$url = 'http://springsummer.dk/'
$img_path = '/var/www/html/application/app/webroot/img/test.png'

$output = exec($phantomjs_path . 'bin/phantomjs --ssl-protocol=any ' . phantomjs_path  . 'utilities/Desktop.js ' . $url . ' ' . $img_path );

我还检查了有关此问题的一些关于stackoverflow的帖子，但他们没有帮助。

添加滚动后的代码：

var page = require('webpage').create(),
    system = require('system'),
    address, output, size;

var height = 0;

if (system.args.length < 3 || system.args.length > 5) {
    console.log('Usage: rasterize.js URL filename [paperwidth*paperheight|paperformat] [zoom]');
    console.log('  paper (pdf output) examples: "5in*7.5in", "10cm*20cm", "A4", "Letter"');
    phantom.exit(1);
} else {
    address = system.args[1];
    output = system.args[2];
    page.viewportSize = { width: 1366, height:768 };
    if (system.args.length > 3 && system.args[2].substr(-4) === ".pdf") {
        size = system.args[3].split('*');
        page.paperSize = size.length === 2 ? { width: size[0], height: size[1], margin: '0px' }
                                           : { format: system.args[3], orientation: 'portrait', margin: '1cm' };
    }
    if (system.args.length > 4) {
        page.zoomFactor = system.args[4];
    }

    console.log('Opening');

    page.open(address, function (status) {
        if (status !== 'success') {
        console.log("status: " + status);
            console.log('Unable to load the address!');
            phantom.exit();
        } else {
        height = page.evaluate(function() {

          window.scrollTop = document.body.scrollHeight;
          return document.body.scrollHeight;
        });
        console.log(height);
        page.viewportSize = { width: 1366, height: height };
        console.log("Height set");            
        }
    });

    console.log('2nd');
    if(height > 0){
    console.log("Reloading...");
    page.open(address, function(status){
        if (status !== 'success') {
        console.log("status: " + status);
            console.log('Unable to reload the address!');
            phantom.exit();
        } else {
        console.log("Capturing ...");
            window.setTimeout(function () {
                page.render(output);
                phantom.exit();
               }, 3000);
        }
    });
    }

    phantom.exit();
}