使用打印按钮在浏览器中将字节数组显示为PDF？

Question

我正在开发一个应用程序，我必须在浏览器上显示PDF。 我通过webAPI从第三方获取PDF字节数组。 我发现显示pdf的方法之一如下。

var pdfAsDataUri = "data:application/pdf;base64,"+byteArray;
window.open(pdfAsDataUri);

我不喜欢这种方法，因为它在URL中显示base64编码格式，有没有其他方法将字节数组转换为PDF并在HTML页面上显示与打印对话框（ window.print() ）。

Answer 1

在现代浏览器中，您可以使用Blob 创建一个对象URL ，然后可以使用该URL而不是base64 URL（在不同的浏览器中有一些限制，如长度限制）。

这是一个可行的例子。 此示例在iframe显示PDF，但您可以使用该objectURL实际执行任何操作，例如在新选项卡中打开它或其他任何内容。

 var xhr = new XMLHttpRequest(); xhr.responseType = 'arraybuffer'; xhr.onload = function() { // Create the Blob URL: var buffer = xhr.response; var blob = new Blob([buffer], { type: 'application/pdf' }); var objectURL = URL.createObjectURL(blob); // Create an iframe to demonstrate it: var iframe = document.createElement('iframe'); iframe.className = 'sample-iframe'; iframe.src = objectURL; document.body.appendChild(iframe); console.log(objectURL); }; xhr.open('GET', 'https://cors-anywhere.herokuapp.com/http://www.xmlpdf.com/manualfiles/hello-world.pdf', true); xhr.send(); 

 html, body { width: 100%; height: 100%; } .sample-iframe { width: 90%; height: 90%; } 

当然，浏览器的PDF内置打印功能也可以使用。