ブラウザでPDFをレンダリングする

Question

私は今日、これについて多くの異なるSOの投稿を見てきました。

ブラウザ内にPDFドキュメントを表示する必要があるアプリケーションがあります。このアプリケーションは、IE（11+）でも動作する必要があります。

ここには、srcのiframeが問題なく動作します。ような何か：

<iframe src="www.myurl.com/thedocument"></iframe> 

しかし、www.myurl.com/thedocumentは現在のOAuthで保護されています。つまり、www.myurl.com/thedocumentに適切な認証ヘッダーの資格情報を要求する必要があります。

これは、私がwww.myurl.com/thedocumentをajax経由でリクエストしなければならないことを意味します。 ajaxリクエストは、base64、またはドキュメントを含むバイト[]を返します。

IEはPDFをレンダリングするためのデータURIをサポートしていないため、私のajaxリクエストからの応答をiframeにスプライン表示できません。

だから今私は立ち往生しています。

アイデア？

Answer 1

一つの選択肢はPDF.jsを使用することです

おかげで、support for IE10+とHTML5のキャンバスにPDFファイルをレンダリングするためのJavaScriptライブラリ。ライブラリは、ajaxリクエストの結果から生成されるTypedArray（例えばUint8Array）からのPDFデータの読み込みをサポートしています。

私は、base64でエンコードされたバイナリに格納された1ページのPDFを表示する短い例hereを用意しました。 BASE64変換の実行を回避するには、TypedArrayは、XMLHttpRequestの応答から直接取得することができます

function reqListener() { 
    var byteArray = new Uint8Array(this.response); 
    PDFJS.getDocument(byteArray).then(function(page) { 
     // .... 
    }); 
} 

var req = new XMLHttpRequest(); 
req.addEventListener("load", reqListener); 
req.responseType = "arraybuffer"; 
req.open("GET", "http://www.example.com/example.pdf"); 
req.send(); 

あなたはネイティブPDFビューアに期待される機能（印刷など）ライブラリはexample viewerを含んをサポートすることあなた自身の目的に適応することができます。