印刷ボタンでブラウザにバイト配列をPDFとして表示しますか？

Question

ブラウザでPDFを表示する必要があるアプリケーションで作業しています。 webAPI経由で第三者からPDFバイト配列を取得しています。私がpdfを表示するために見つけた方法の1つは以下の通りです。

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

それはURL形式をbase64エンコードを表示するので、私はこのアプローチを好きではない、PDFにバイト配列に変換し、印刷ダイアログ（window.print()）と一緒にHTMLページ上で表示するための他の方法があります。

Answer 1

現代のブラウザでは、Blob〜create an object 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://crossorigin.me/http://www.xmlpdf.com/manualfiles/hello-world.pdf', true); 
 
xhr.send();

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

、組み込みの印刷機能PDFのために、ブラウザのも動作します。