Я пытаюсь использовать pdfkit.js (ознакомьтесь с демонстрация в браузере) и blob-stream.js для создания PDF-документа и его оперативного отображения в браузере.
Below is the code creates a blob:null/id:
$(document).ready(function() {
var doc = new PDFDocument();
var stream = doc.pipe(blobStream());
doc.fontSize(25).text('Here are some vector graphics...', 100, 80);
doc.end();
stream.on('finish', function() {
var iframe = document.querySelector('iframe');
var blob_url = stream.toBlobURL('application/pdf');
iframe.src = blob_url;
});
});
iframe {
border: 1px solid black;
}
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js'></script>
<script src='https://github.com/devongovett/pdfkit/releases/download/v0.8.0/pdfkit.js'></script>
<script src='https://github.com/devongovett/blob-stream/releases/download/v0.1.3/blob-stream.js'></script>
<iframe width="600" height="775"></iframe>
Когда я запускаю это локально, я вижу следующий вывод в консоли инструментов Chrome:
Ресурс интерпретируется как документ, но передается с типом MIME application/pdf: "blob:null/id".
Недавно я узнал, что это, вероятно, как-то связано с фреймами и их происхождением. Я попытался обновить iframe до: <iframe id='pdf_iframe' sandbox="allow-same-origin" width="600" height="775" type="application/pdf"></iframe>
. Однако это не решило проблему.