Phantomjs 无法正确捕获网页的屏幕截图答案

【问题标题】：Phanomjs not properly capturing screenshot of a web pagePhantomjs 无法正确捕获网页的屏幕截图
【发布时间】：2015-05-16 19:07:11
【问题描述】：

我正在测试 phantomjs 从本地网页创建屏幕截图。

这就是 HTML 在 localhost 中呈现的方式 - Output

但在从代码创建 pdf 时，PDF 中的宽度设置不正确，即某些文本被剪切，如下所示。

下面是我累的代码-

var url = 'http://localhost:5656';
page.open(url);

page.onLoadFinished = function() {
    var pdfName = 'screen';
    page.render(pdfName + ".pdf");
    var height = page.evaluate(function() { return document.body.offsetHeight }),
        width = page.evaluate(function() { return document.body.offsetWidth });
    console.log(height,width);  
};

我也尝试了这两个属性，但得到了相同的结果 -

page.clipRect = { top: 0, left: 0, right: 0, width: 1286};
page.viewportSize = { width: 1024, height: 768};

让我知道我在这里做错了什么。

我得到的输出 - pdf image I am getting

【问题讨论】：

标签： javascript node.js pdf phantomjs webpage-rendering

【解决方案1】：

我自己解决了这个问题。以下是工作代码-

var url = 'http://localhost:5656';
page.open(url);

page.onLoadFinished = function() {
    //page.viewportSize = { width: 1400, height: 1200 };
    page.paperSize = {format: 'A4'};
    var pdfName = 'screen';
    page.render(pdfName + ".pdf");
    var height = page.evaluate(function() { return document.body.offsetHeight }),
        width = page.evaluate(function() { return document.body.offsetWidth });
    console.log(height,width);  
};

如你所见，以下是为我施展魔法的那一行 -

page.paperSize = {format: 'A4'};

希望对以后的访问者有所帮助。

【讨论】：