###前提・実現したいこと
PDF.js(ver 1.6.348)を使って、システムからS3にアップロードされたPDFファイルを閲覧できるようにしています。
描画するのは1ページずつです。
対応ブラウザは下記のとおりです。
- Chrome 最新
- FireFox 最新
- IE10, 11 最新
- Edge 最新
- Safari 最新
対応OSは下記のとおりです。
- Windows7
- Windows10
- Mac OS
スマホは対象外です。
###発生している問題
IE10, IE11にて文字が描画されない。
※ 2016/12/26: IE10は直ったようです。
###該当のソースコード
独自処理も組み込んでいるため、少々お待ちください・・・
###試したこと
1. はじめ、そもそもPDFが表示されなかった為、調査。
URI形式でPDFを扱っていたことが原因と分かり、下記のように修正。
javascript
1 var xhr = new XMLHttpRequest(); 2 xhr.open('GET', file_path, true); 3 xhr.responseType = 'arraybuffer'; 4 xhr.onload = function(e) { 5 if (this.status == 200) { 6 /* before 7 var blob = new Blob([this.response], {type: 'application/pdf'}); 8 pdfjsApi.pdfUrl = URL.createObjectURL(blob); 9 */ 10 /* after */ 11 pdfjsApi.pdfUrl = new Uint8Array(this.response); 12 13 pdfjsApi.init(); // PDFJS.getDocumentへ 14 } 15 }; 16 xhr.send();
2. SVGで描画しようとする
そもそも描画が上手くできず、一旦放置
3. テキストコピーが出来るようなPDFビューアーを用意する処理を追記してみる
文字が表示出来ていないPDFでは、この処理も上手くいかない模様。
page.getTextContent()で、文字列が取得できないことが分かりました。
ただ、これは他の文字が表示できているブラウザでも同じく、この関数でページ上の文字列は取得できていないです。
(ここから原因を探ろうと思っております)
###補足情報(言語/FW/ツール等のバージョンなど)
読み込んでいるjsファイル
- pdf.js
- pdf.worker.js
- compatibility.js
- text_layer_builder.css
- text_layer_builder.js
※ Mac版Chromeでも同様のことが起こっているのですが、
上記1の対応を反映させてからの確認が出来ていないため記載を省いております。
- ちなみに、読み込めないPDFは弊社の営業資料の為開示できません・・・・。
不足している項目等ございましたら、ご質問頂けると幸いです。
よろしくお願い致します。
あなたの回答
tips
プレビュー