Pdf.js: Viewer.jsはオンラインPDFストリームを取得できません

関連する問題は、＃522、＃586、および＃842です。

上記の問題で参照されているように、これはユーザーがプロキシまたはCORSを使用して自分で修正する必要があるものです。

こんにちはブレンド、

「ユーザーがプロキシまたはCORSを使用して自分で修正する必要がある」主な理由は何ですか？

PDFがローカル（アップロード）、サーバーをファイル、サーバーを「http：//」のようなストリームから取得できることが重要です。

画像のURLとして、PDFリーダーはHTTPURLをサポートする必要があります。

ありがとう

@jonasyuandotcom corsを使用すると、同じサーバーからhttpを使用してPDFを取得できます。 ただし、ブラウザはユーザーを外部サーバーへのデータの取得/送信から保護します。 これらのサーバーは、この制限を回避するためにhttpヘッダーを使用する必要があります。

サーバー側のプロキシはビューアと同じサーバーに配置されるため、corsはそれで問題ありません。

@notmasteryetありがとう。 のような同じサーバーを使用するときに動作します

var kDefaultURL = '/ pdf-reader-web / sample.pdf';

こんにちはジョナス、

ブラウザのセキュリティ制限のために実装できないため、これを実装することはありません。 http://en.wikipedia.org/wiki/XMLHttpRequest#Cross-domain_requestsを参照して

ブレンダン

こんにちは@brendandahl

2011年以降に更新があるかどうか疑問に思いましたか？ CORSの問題を修正することはまだ不可能ですか？

はい。 詳細については、 https： //github.com/mozilla/pdf.js/wiki/Frequently-Asked-Questions#faq-xhrを参照して

ありがとうティム！

こんにちは@timvandermeij。 ご返信ありがとうございます。 多くのソリューションを試しましたが、WebサーバーでCORSを許可できません。 gitの例はありますか？

@Dassineここに行きますhttp://mozilla.github.io/pdf.js/web/viewer.html?file=//async5.org/moz/pdfjs.pdf-PDFビューアはhttp://async5.orgをロードします

ブラウザコントロールをデスクトップ/モバイルアプリケーションに埋め込む場合は、OS / Framework APIを使用してバイナリデータをリクエストし、それをUint8ArrayとしてPDF.jsに渡すことができます。

リンクをありがとう@yurydelendik 。 PDF.jsがCORSを管理していないことを私は知っています。 @timvandermeijなどから送信されたソリューションを試しましたが、失敗しました。 pdf.jsリポジトリがダウンロードされたら、適切な実装/変更ソリューションを探しています。 ありがとう

@yurydelendikリモートPDFファイルのロードにも問題があります。 ただし、このエラーはChromeでのみ発生します。
PDF.js v1.0.1040（ビルド：997096f）
メッセージ：PDF " http://bhpr.hrsa.gov/healthworkforce/rnsurveys/rnsurveyfinal.pdf "の取得中に予期しないサーバー応答（0）が発生しました。

ロードしようとしているPDFが、制御できない別のサーバーにあることがわかります。 それでも、このPDFをviewer.jsに表示したいと思います

CORSの経験はあまりありませんが、サーバー上にセキュリティが最も低いcrossdomain.xmlファイルを作成しましたが、それでも機能しません。

@hashbyteサーバーのプロキシが必要になります。 非常に単純なプロキシ（私が開発したもの）はCORSAnywhereです。 PDFファイルへのURLの前にプロキシのURLを追加するだけです。

"https://cors-anywhere.herokuapp.com/" + 
"http://bhpr.hrsa.gov/healthworkforce/rnsurveys/rnsurveyfinal.pdf" =
"https://cors-anywhere.herokuapp.com/http://bhpr.hrsa.gov/healthworkforce/rnsurveys/rnsurveyfinal.pdf"

次に、このURLをURLエンコードし、 fileパラメーターに入れると、任意のページを開くことができるリンクが表示されます： https ：

注：PDFのURLにパーセント記号や&文字が含まれていない場合、リンクをすばやく取得する簡単な方法は、リンクの前にビューアのURLを追加することです（つまり、最初にURLエンコードを使用しないでください）。 ）。 これは、URLを手動で入力する場合にのみ実行してください（たとえば、クイックテストを実行する場合）。
https://mozilla.github.io/pdf.js/web/viewer.html?file=https：//cors-anywhere.herokuapp.com/http://bhpr.hrsa.gov/healthworkforce/rnsurveys/rnsurveyfinal 。 pdf

注： CORS Anywhereデモは、機能をデモンストレーションするためにのみ提供されています。 訪問者が多いサイトでこの機能を使用する場合は、パブリックデモサーバーに不当な負荷をかけないように、CORSAnywhereインスタンスを自分でホストしてください。 悪用によりCORSAnywhereのパフォーマンスがクロールしていることに気付いた場合、オリジンはブラックリストに登録されます。 CORS Anywhereを自分でホストする場合は、この種の悪用を回避するために、 originWhitelist構成パラメーターを介してのみサイトへのアクセスを制限できます。

こんにちは、
外国のURLからPDFをロードしたいときにこのエラーが発生します

エラー：ファイルの出所がビューアの出所と一致しません
新しいエラーをスローします（ 'ファイルの出所がビューアと一致しません\' s '）;

助けてください！

外国のURLからPDFをロードしたいときにこのエラーが発生します

@gildassamuel詳細については、＃6916を参照してください。

@jonasyuandotcomファイルを自分で管理する場合は、ファイルとpdfjsを同じファイルサーバーに置くことができます。

ちょっと私はファイルサーバーに「Access-Control-Allow-Origin」を設定するための指示に従いましたが、私はこのエラーを受け取り続けます：

httpヘッダーは次のとおりです。

問題の考えられる原因を特定できるかどうかわからない場合でも、ポインタをいただければ幸いです。 どうもありがとうございました！

@yjguooエラーメッセージとヘッダーが

リダイレクトターゲットに期待されるヘッダーが不足していると思います。

chrome://net-internals/#eventsアクセスし、手順を繰り返して、ブロックされたリダイレクトの実際のヘッダーをログに表示します。

こんにちはロブは迅速な対応に感謝します、

要求されたURL「https://files.dev52.slack.com/files-pri/T076SHX5W-F07CGBKK2/git-for-beginners-handout.pdf」を手動で入力すると、ファイルサーバーから異なる応答ヘッダーが返されます。

応答ヘッダーの別の場所にルーティングされていることに注意してください。 そして、その新しい場所で、ステータス200okを取得します。

私の最初の質問：ブラウザにURLを手動で入力することと、XmlHttpRequestを使用することには違いがありますか？
ところで、私はデフォルトのpdf.jsビューア（html css js）を使用していますが、異なるオリジンからのpdfを要求することを除いて、すべての機能が機能します（ei cross oring request issue）
2番目の質問：それは私の側の問題だと思いますか、それともデフォルトのviewer.js /pdf.jsがXmlHttpRequestを実行している方法に問題があると思いますか

ありがとう ：）

私の最初の質問：ブラウザにURLを手動で入力することと、XmlHttpRequestを使用することには違いがありますか？

はい、特にクロスオリジンリクエストの場合はそうです。 クロスオリジンリクエストを実行すると、リクエストはCORSによって許可されている場合にのみ受け入れられます。 ブラウザはOriginヘッダーを使用してリクエストを発行し、サーバーはこれを使用してリクエストを承認するかどうかを決定できます（リクエストされた発信元をAccess-Control-Allow-Origin応答ヘッダーに含めることにより）。

また、デフォルトでは、クレデンシャルはクロスオリジンリクエストに含まれていません。 Cookieを含めるには、サーバーがAccess-Control-Allow-Credentials: true応答し、XHRリクエストでwithCredentials属性がtrue設定されている必要があります。

2番目の質問：それは私の側の問題だと思いますか、それともデフォルトのviewer.js /pdf.jsがXmlHttpRequestを実行している方法に問題があると思いますか

サーバーの構成を変える必要があると思います。

詳細については、MDNのドキュメントを参照してください： https ：
または、CORSの仕様をお読みください： //www.w3.org/TR/2014/REC-cors-20140116/

こんにちはロブ、

Access-Control-Allow-Credentials: trueも設定して問題を解決したと思います。 助けてくれてありがとう<3。 ただし、リダイレクトに関して別の問題が発生し、ポインタを教えてもらえるかどうかわかりません。 XHRを実行します
URL＃1を使用してリクエストします（修正に役立つ問題）。 次に、URL＃2（ステータス302）へのリダイレクトを取得します。 ただし、URL＃1とURL＃2はどちらも同じサーバーを指しています。 次のエラーが発生します。

URL＃1に対して行ったのと同じ応答ヘッダーを設定しようとしましたが、両方とも同じサーバー上にあり、Originがnullであることがわかりました。

両方のURLが同じサーバーを指しているため、リダイレクト元がNULLであるためだと思いますが、よくわかりませんか？ 次に、2つの異なるオリジンを処理するヘッダーを追加するにはどうすればよいでしょうか。ただし、両方のURLが同じファイルサーバーを指しています。 *のような正規表現を使用してみましたが、どうやら許可されていません:(もう一度ありがとうございます！

クロスオリジンリダイレクトの後、ChromeはOriginヘッダーを実際のURLではなく「null」値に設定します-https：//crbug.com/154967

条件付きでAccess-Control-Allow-Originを値nullで返すことができますが、これはすべてのWebサイトがそのリソースを読み取れるようにする場合に限ります。 そうでない場合（最も可能性が高い）、リダイレクトを回避する必要があります。 たとえば、リクエストを宛先URLに直接送信します（事前にURLがわからない場合は、宛先URLを返す新しいAPIエンドポイントをサーバーに追加します）。

ありがとう！ 私はそれを調べます:)

ちょっとロブあなたは、すでに設定されたsrcでpdfビューアまたはpdf.jsを初期化し、XHRリクエストをすべて一緒に回避する別の方法があると思いますか？

@yjguoo PDFデータをbase64でエンコードし、データURLを使用できます。 大きなPDFファイルの場合、base64としてデータをエンコードするとファイルサイズが33％増加するため、ユーザーエクスペリエンスが低下します（=プログレスバーのない空白のページ）。 このため、XHRを引き続き使用することをお勧めします。

こんにちは、テストしたばかりで、CORSが有効になっている場合は機能しますが、ファイルが非常に大きい場合、ファイルがチャンク/範囲で取得されないことがわかります。

これを.htaccessに追加して解決しました：
ヘッダーセットAccept-Rangesバイト
ヘッダーセットAccess-Control-Allow-Origin "*"
ヘッダーセットAccess-Control-Allow-Methods "GET"
ヘッダーセットAccess-Control-Allow-Headers "Content-Type、Range"
ヘッダーセットAccess-Control-Expose-Headers "Accept-Ranges、Content-Encoding、Content-Length、Content-Range"

ありがとう！！！

@ Rob--Wとても助かりました。 プロジェクト内から機能する可能性はありますか（XHRヘッダーの変更など）？ （worker.js内）

こんにちは、まだこれに問題がある人のために、私はそれを次のように解決しました：

https://drive.google.com/viewerng/viewer?embedded=true&url=http://www.africau.edu/images/default/sample.pdf