自定义标题的屏幕截图

时间:2018-02-09 18:23:11

标签: javascript phantomjs

我正在使用phantomJS来截取页面。可以使用page.paperSize参数传递自定义标头参数。

我的代码在下方,但在结果图像上没有打印标题。我都没有收到任何错误。在这方面的任何暗示都受到高度赞赏。

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

page.viewportSize = {
  width: 600, 
  height: 500
};

page.open('https://twitter.com/MaraWilson/status/960451771444310016', function() {
  page.paperSize = {
    width: '8.5in',
    height: '11in',
    header: {
      height: "1cm",
      contents: phantom.callback(function() {
        return "<h1>Header <span style='float:right'>Test</span></h1>";
      })
    },
  };    

  page.render('test.png');
  phantom.exit();
});

我得到的结果图像如下完全没有标题

enter image description here

更新 在收到@Vaviloff的建议并仔细阅读文档之后,很明显page.paperSize仅用于PDF文档。但我的问题是PNG特有的。

1 个答案:

答案 0 :(得分:1)

来自文档:http://phantomjs.org/api/webpage/property/paper-size.html

  

paperSize {object}
  此属性定义以PDF格式呈现时网页的大小。

所以你应该把页面渲染成PDF而不是图像。

另一个想法:尝试使标题更高一些 - 在测试代码时,我必须将标题设置为3厘米高才能真正看到测试文本。