Question

我刚刚开始使用pdf.js，我正在尝试从原始pdf数据加载pdf文件。我见过代码：

PDFJS.getPdf('cwpdf.pdf', function getPdfHelloWorld(data) { 
   ...
}

但我想知道是否有任何方法可以从原始pdf数据而不是从文件名加载pdf。这可能吗？

Answer 1

我整理了一些完整的代码，并且能够找到以下解决方案的问题：

var int8View = new Uint8Array(...); //populate int8View with the raw pdf data
PDFJS.getDocument(int8View).then(function(pdf) {
}

使用此解决方案时，我遇到了其他用户看到的问题（@MurWade和@ user94154） - stream must have data错误消息。看起来问题出在以下几行：

var int8View = new Uint8Array(...);

由于数据不是预期的格式，因此无法正确创建包含数据的数组。因此，这条线适用于某些情况，但在一般情况下可能不起作用。

我已经整理了一个完整的解决方案，似乎效果更好。它加载PDF文件，并将其转换为原始PDF流。这仅用于测试目的，在现实世界的示例中，PDF流可能以不同的方式接收。您可以在调试器中检查流，它将显示为纯文本。下面是使此示例工作的代码的关键行。而是将原始PDF流转换为数组，将其转换为数据。

var docInitParams = { data: pdfraw };

然后继续加载数据。以下是如何加载标准原始PDF流并显示它的完整工作示例。我曾经以PDF JS hello world sample为出发点。如果有必要澄清，请在评论中告诉我。

'use strict';

PDFJS.getDocument('helloworld.pdf').then(function(pdf) {


  pdf.getData().then(function(arrayBuffer) {
    var pdfraw = String.fromCharCode.apply(null, arrayBuffer);

    var docInitParams = {
      data: pdfraw
    };
    PDFJS.getDocument(docInitParams).then(function(pdfFromRaw) {
      pdfFromRaw.getPage(1).then(function(page) {
        var scale = 1.5;
        var viewport = page.getViewport(scale);

        var canvas = document.getElementById('the-canvas');
        var context = canvas.getContext('2d');
        canvas.height = viewport.height;
        canvas.width = viewport.width;

        var renderContext = {
          canvasContext: context,
          viewport: viewport
        };
        page.render(renderContext);
      });
    });
  });
});

Answer 2

好吧，因为没有其他人回答我会发布我的发现。我想是的，可以从原始数据加载pdf文件。这样做的方法是使用一个UInt8Array填充数据来代替存储pdf文件的URL。

执行此操作的示例代码如下：

var int8View = new Uint8Array(...); //populate int8View with the raw pdf data
PDFJS.getDocument(int8View).then(function(pdf) {

}

使用pdf.js从原始数据显示pdf

2 个答案: