javascript - 在浏览器中的 ie 中渲染 PDF

Question

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

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

事情是这样的:带有 src 的 iframe 工作得很好。像这样的东西:

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

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

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

IE 不支持数据 URI 来呈现 PDF，所以我不能直接将 ajax 请求的响应放到 iframe 中。

所以..现在我卡住了。

有什么想法吗？

谢谢

Answer 1

一个选择是使用 PDF.js ，一个用于将 PDF 渲染到 HTML5 Canvas 中的 javascript 库 support for IE10+ .该库支持从 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();

为了支持您在 native pdf 查看器(打印等)中期望的功能，该库包含一个 example viewer您可以根据自己的目的进行调整。