在浏览器内部使用ie呈现PDF文件

Question

我今天浏览了许多关于这个问题的不同 SO 帖子。

我有一个应用程序需要在浏览器中显示 PDF 文档。该应用程序还需要在 IE（11+）中运行。

下面是关键：使用 src 属性的 iframe 可以正常工作。类似这样：

<iframe src="www.myurl.com/thedocument"></iframe>

然而，www.myurl.com/thedocument现在受到oAuth的保护。这意味着我需要使用适当的授权头凭据请求www.myurl.com/thedocument。

这意味着（我认为），我必须通过ajax请求www.myurl.com/thedocument。Ajax请求返回base64或包含文档的byte[]。

IE不支持数据URI来渲染PDF，所以我不能只是将我的ajax响应直接插入iframe中。

所以现在我陷入困境了。

你有什么想法吗？

谢谢

- Jeff

Answer 1

一种选择是使用PDF.js，这是一个用于将PDF渲染成HTML5画布的JavaScript库，支持IE10+浏览器。该库支持从TypedArray（例如Uint8Array）加载PDF数据，可以从ajax请求的结果中生成。

我准备了一个简短的示例，显示存储在base64编码二进制中的单页PDF。为避免执行base64转换，也可以直接从XMLHttpRequest响应中检索TypedArray：

function reqListener () {
    var byteArray = new Uint8Array(this.response);
    PDFJS.getDocument(byteArray).then(function(page) {
        // ....
    });
}

var req = new XMLHttpRequest();
req.addEventListener("load", reqListener);
req.responseType = "arraybuffer";
req.open("GET", "http://www.example.com/example.pdf");
req.send();

为了支持本地pdf查看器中的功能（如打印等），该库包含了一个示例查看器，您可以根据自己的需要进行调整。请参考示例查看器。

- tmw

---

PDF.js是一个很棒的库。然而，一次性渲染PDF的所有页面并不是该库擅长的（而在Chrome中渲染数据URI则可以显示PDF中的所有页面 - 而且做得非常好）。这是一个很好的建议。不幸的是，它没有我正在寻找的特定功能。 - Jeff

没问题。这不是渲染它们最高效的方式，但对于文本密集型文档来说似乎还不错。如果你还没有尝试过，可以尝试在demo中打开你的pdf文件，看看是否符合要求。 - tmw

在IE浏览器中，你只能使用PDF.js或iframe来实现。根据我的研究，考虑到你的情况，你不能使用iframe，因为IE不支持data uri iframe，所以在这里你选择不多。 - Sheepy