在浏览器中的 ie 中渲染 PDF答案

【问题标题】：Rendering PDFs in ie inside the browser在浏览器中的 ie 中渲染 PDF
【发布时间】：2016-02-20 17:08:34
【问题描述】：

我今天看了很多关于这个的不同 SO 帖子。

我有一个需要在浏览器中显示 PDF 文档的应用程序。此应用程序还需要在 IE (11+) 中运行。

事情是这样的：iframe 和 src 可以正常工作。比如：

<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 中。

所以..现在我被卡住了。

有什么想法吗？

谢谢

【问题讨论】：

标签： javascript internet-explorer pdf iframe

【解决方案1】：

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

我准备了一个简短的示例 here，它显示了存储在 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 查看器（打印等）中所期望的功能，该库包含一个 example viewer，您可以根据自己的目的进行调整。

【讨论】：

PDF.js 是一个很棒的库。但是，一次渲染 pdf 的所有页面是库做得不好的事情（在 chrome 中渲染数据 uri 会显示 pdf 中的所有页面 - 它做得很好）。这是一个很好的建议。不幸的是，它没有我正在寻找的特定功能。
没问题。这不是呈现它们的最高效方式，但对于文本量大的文档来说，它似乎并不算太糟糕。如果您还没有，您可以尝试在demo 中打开您的 pdf，看看它是否符合要求。
@Jeff 对于 IE，它是 PDF.js 或 iframe。根据我的研究，鉴于你的情况你不能使用 iframe，因为 IE 不支持 data uri iframe，所以你在这里没有太多选择。