如何在任何网站上正确使用PhantomJS？

Question

我尝试使用 PhantomJS 捕获网站，特别是我使用Pageres。

这个网站有：

• AngularJS
• LocalStorage使用
• AJAX对API的请求

所以，我在本地进行测试并且我没有得到预期的结果，有时屏幕截图会出现错误 - 显示内容的部分，有时它会赢得＆＃39; t渲染完整的内容。

看起来，当网站完全加载后，Pagerer没有足够的时间来截取屏幕截图。我已经添加了延迟选项，但无论如何它都会失败，实际上我可以说它在延迟选项中效果更好。

这是 应该 呈现的内容：

当它运作得最好时，这就是我得到的：

这是我的渲染代码：

  var pageres = new Pageres({})
      .src('fantastica.a2015.mediotiempo.com', ['1440x900'], {delay: 3, crop: false});

  pageres.on('warn', function (err,obj) {console.log(err,obj)});
  pageres.run(function (err, screenshot) {
      screenshot[0].pipe(response);
  });

And, (I know there would be MUCH code to explain now) this is JS code being rendered.

有什么特别的建议吗？

Answer 1

• 请注意Phantom版本之间的差异。

Phantom 1.9.x（Pageres正在使用）是几年前的浏览器引擎（Chrome 13是最接近的等价物）并且不会渲染许多HTML5功能。

Phantom 2.x是一个更现代的webkit引擎。但是因为：a）因为他们没有生成现成的linux二进制文件; b）一些小的API变化，像CasperJS和Pageres这样的项目正在阻止它的支持。根据{{​​3}}中的评论，如果您创建自己的二进制文件和符号链接，它就可以工作。

另请注意，SlimerJS是PhantomJS的替代品，基于Firefox而非WebKit。没有基于Blink的类似项目（获取现代Chrome将如何呈现它们的截图），但是有针对IE的TrifleJS。 （但是，Pageres页面表示支持其他引擎不是项目的目标。）

• 等待DOM元素出现，而不是使用延迟。

Ajax调用，延迟加载等使事情很难预测。因此，请输入一个轮询循环，并且在您的屏幕截图中所需的DOM元素现在可见之前不要截取屏幕截图。对于这种情况，CasperJS有waitForSelector()。 PhantomJS的级别略低waitFor()。

我认为Pageres需要一些黑客才能添加此功能。