質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

1回答

8735閲覧

PDF.jsでの外部URLを使用する方法

m8623798917

総合スコア12

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

0グッド

0クリップ

投稿2020/04/21 01:35

編集2020/04/21 02:48

前提・実現したいこと

PDFの表示する際にPDF.jsを使用したいと考えています。
サンプルPDFも表示されAWSのS3にあるPDFを表示させる際に file origin does not match viewer's と言うエラーがでました。

S3からのURL自体は問題なく表示されています。

発生している問題・エラーメッセージ

メッセージ: file origin does not match viewer's

該当のソースコード

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div id="iframeBlock"> <div class="iframeBody"> <iframe src="http://localhost/pdfjs-2.3.200-dist/web/viewer.html?file=https://XXXXXXX.cloudfront.net/XXXXXXX.pdf"></iframe> </div> </div> </body> </html>

試したこと

https://github.com/mozilla/pdf.js/issues/7153
コメントアウト

if (origin !== viewerOrigin && protocol !== 'blob:') { throw new Error('file origin does not match viewer\'s'); }

https://ja.coder.work/so/javascript/1360216
追加

<!-- Sample policy --> <CORSConfiguration> <CORSRule> <AllowedOrigin>*</AllowedOrigin> <AllowedMethod>GET</AllowedMethod> <AllowedMethod>HEAD</AllowedMethod> <MaxAgeSeconds>3000</MaxAgeSeconds> <AllowedHeader>Authorization</AllowedHeader> </CORSRule> </CORSConfiguration>

ご教授ください。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2020/04/22 07:01

メッセージ: file origin does not match viewer's そのままmじゃ? origin (ホスト名) が一致してないよ
m8623798917

2020/04/22 07:07

S3だけのホスト名はあっています。 PDF.jsの特性で同一ドメイン内でないといけないと言う縛りがあるのでそれを解除する方法を探しています。
退会済みユーザー

退会済みユーザー

2020/04/22 07:54

issue にほかの対応(チェックを消すなこっちを修正しろ)ってあるがしたんですか?
退会済みユーザー

退会済みユーザー

2020/04/22 07:55

チェック消したのにチェックが消えてないって文句いってる issue にみえるが
m8623798917

2020/04/22 08:02

申し訳ありません、解決方法はどこのイシューになりますでしょうか?
m8623798917

2020/04/22 08:10

その中のどこのコメントでしょうか? お手数をおかけします。
guest

回答1

0

PDF.jsにもS3にも詳しくはないのですが、
ビューア本体(viewer.html)がローカル(localhost)のファイルになっているからではないでしょうか?

投稿2020/04/22 06:49

退会済みユーザー

退会済みユーザー

総合スコア0

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2020/04/22 07:47

なるほど。 同じドメインでないとダメみたいですね。 AjaxでCROSの設定を行えば良い、みたいな記事はちらほら出てきますが、 ピンとくるものがサクッと見つかりそうにないです。お役に立てずすみません、、、
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問