Phantomjs / Casper 不会在 <iframe> 中渲染 <embed>

Question

我正在进行这项测试，我必须在其中获取 pdf 文件的内容。 html 结构（在传统浏览器的客户端呈现后）是这样的

<iframe id="frame" name="frame" src="a link" id="frame" >
   <embed id="plugin" src="src to pdf file">
        pdf shows up here
   </embed
</iframe>

当我在 casper 上输出 html 时，iframe 内容是空的，我的代码是这样的

casper.then(function(){
    this.wait(5000);
    casper.withFrame('frame', function(){
       //the page renders whell but it won't show the pdf
       this.capture('pic.png');
       this.evaluate(function(){
           //finds
           document.querySelector('body');
           //returns null
           document.querySelector('embed');
       });
    });
);

我不明白为什么 phantom 不使用 pdf 文件渲染元素，有解决方法吗？

Answer 1

很难给你一个深入的答案，因为你没有提供Minimal, Complete, and Verifiable example。但是，我可以建议您几件事来解决您的问题：

1。修复语法错误

您的代码中存在一些语法错误，尤其是当您使用 evaluate 时。回调未正确传递，您没有 return 任何值。要测试 evaluate 结果，您通常必须执行以下操作：

this.echo('Title: ' + this.evaluate(function () {
  return document.title;
}));

2。使用 getHTML() 检查 <embed> 是否存在

在 withFrame 中，您可以使用以下行打印 <iframe> 的原始 HTML 代码：

console.log(this.getHTML());

这就是 CasperJS 实际看到的。

3。测试这个脚本并仔细分析输出

var casper = require('casper').create();

casper.start('URL OF YOUR MAIN PAGE');

casper.then(function () {
  this.echo('Main page: ' + this.getTitle());
  this.wait(5000).withFrame('frame', function () {
    this.echo('iframe: ' + this.evaluate(function () {
      return document.title;
    }));
    this.capture('pic.png');
    console.log(this.getHTML());
  });
});

casper.run();