使用pdf.js來顯示原始數據的pdf

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樣本作爲起點。請在評論中告訴我，如果有任何澄清是必要的。

'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文件存儲位置。

示例代碼做，這是下面：

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

}