Pdf.js: [email protected]のunsafe-inlineのCSP違反

v2.2.228 Function（ "r"、 "regeneratorRuntime = r"）（runtime）;のこの行がポリシーに違反してい

これは実際にはPDF.jsライブラリ自体のどこからでも発生するコードではなく、古いブラウザでasync / awaitをサポートするために必要なBabelポリフィルに由来します。 そのため、残念ながら、ここでそれについて何ができるか（もしあれば）はまったく明確ではありません。

はい、代わりにアップストリームで報告する必要があると思います。

pdf.jsの@timvandermeijコードは、ポリフィルが不要になるように記述できます。
@Snuffleupagus whtaファイルに関するヒントはありますか？

それを深く調べました。 チャンスは無い ：-（

これが問題regenerator-runtime / runtime.jsです。

ここで同じ問題。

@Snuffleupagus 2つの別々のファイルを古いブラウザ用に1つ、常緑ブラウザ用に2つ配布することは可能ですか？

追跡する上流の問題はありますか？ 現在同じ問題に直面している

問題はhttps://github.com/facebook/regeneratorに報告でき

pdf.jsの作者がこの問題をここで修正したようです

https://github.com/facebook/regenerator/pull/353

しかし、バベルの問題のために、彼らはそれをロールバックしなければなりませんでした

https://github.com/facebook/regenerator/pull/369

ここでデッドロックが発生しているようです。 ここに3つの解決策があります。

• facebook/regeneratorで問題が解決するまで待ちます。
  それは最も明確かもしれませんが、多くのユーザーは古いバージョンのpdf.jsに固執するでしょう
• facebook/regeneratorダウングレードします（おそらく、babelもダウングレードする必要があります）
• 現在のES5に加えて、 facebook/regenerator必要としない常緑樹（ES2016 +）バージョンのpdf.jsを提供します。 （現在のWebアプリケーションの多くはES5に準拠している必要はありませんでした）。

とにかく、CSP違反はここに十分に文書化されています
https://github.com/facebook/regenerator/blob/6e9e8d7747c2ab49927bdd9dd6261753181faec1/packages/regenerator-runtime/runtime.js#L716 -L725

  // This module should not be running in strict mode, so the above
  // assignment should always work unless something is misconfigured. Just
  // in case runtime.js accidentally runs in strict mode, we can escape
  // strict mode using a global Function call. This could conceivably fail
  // if a Content Security Policy forbids using Function, but in that case
  // the proper solution is to fix the accidental strict mode problem. If
  // you've misconfigured your bundler to force strict mode and applied a
  // CSP to forbid Function, and you're not willing to fix either of those
  // problems, please detail your unique predicament in a GitHub issue.
  Function("r", "regeneratorRuntime = r")(runtime);

つまり、CSP違反がある場合は、これを厳密モードで実行しないでください。 これはregenerator-runtimeの既知の動作であるため、pdf.jsではstrict-modeをオフにする必要があります。

@timvandermeij pdf.jsのタスクがあるかどうか、コメントを読み直してください。

ここでは、PDF.jsで何が違うのかよくわかりません。 コメントは明確ですが、エラーを防ぎ、最適化できるように、意図的に厳密モードでPDF.jsを実行しています。 これは以前は発生しておらず、 facebook/regenerator直接使用することすらありません（ただし、別のパッケージの依存関係としてのみ）。些細な変更がない限り、パッチを適用する必要があります。私たちの側で行う必要がありますが、それがどうなるかわかりません...

@timvandermeij

それを理解してくれてありがとう。

pdf.jsのbabel無料バージョンはどうですか？ 最新のブラウザでは、リジェネレータ-ランタイムポリフィルは必要ありません。

@jkroepke理想的には、Babelをまったく使用しないでしょうが、残念ながら、PDF.jsがサポートされているすべてのブラウザーで機能する必要があるため、今のところ、それを取り除くことは検討できません。 もちろん、PDF.jsを自分でビルドして、Babelトランスパイルを無効にすることもできます。

2.3.200でも同じ問題が発生しています。 回避策や修正はありますか？ ありがとう。

@timvandermeij

最後に、pdf.jsは、regenerator-runtime / babelを使用するときにサポートされていないstrictモードを使用しているため、間違っていることがわかります。 したがって、制限が十分に文書化されているため、アップストリームの問題ではなくなりました。

この問題を解決するための4つの選択肢があります。

• 古いバージョンのbabelを使用します。 2.1.266バージョンのpdf.jsにはこの問題はありません。 バージョンを固定すると解決するはずです。 これが最も速いはずです。
• babelの依存関係では厳密モードがサポートされていないため、厳密モードは使用しないでください。
• regenerator-runtimeを使用してトランスパイルプラグインをオフにします。 （https://caniuse.com/#feat=es6-generators）
• pdfjs-distの2つのバージョンを提供します。 1つは古いブラウザー（ES5にトランスパイル）用で、もう1つは現在のブラウザー用です。 （ES6にトランスパイル）

古いバージョンのbabelを使用します。 2.1.266バージョンのpdf.jsにはこの問題はありません。 バージョンを固定すると解決するはずです。 これが最も速いはずです。

古いバージョンへの依存関係を固定することはません。古いバージョンのBabelにセキュリティバグがある場合、それが問題を引き起こす可能性があるためです。 さらに、1つの依存関係の古いバージョンを使用すると、他の依存関係の更新が防止、遅延、および/または複雑になり、他の問題が発生する可能性があります。

[...]（https://caniuse.com/#feat=es6-generators）

明確にするために： PDF.jsライブラリは（現在）ジェネレーター関数を使用していませんが、 async / awaitが使用されているため、この特定の依存関係がここに存在することに注意してください。

pdfjs-distの2つのバージョンを提供します。 1つは古いブラウザー（ES5にトランスパイル）用で、もう1つは現在のブラウザー用です。 （ES6にトランスパイル）

これは上記の提案の中で最も現実的なオプションのように見えますが、それがいつどのように発生するかは現時点では明確ではありません（PR＃11241の議論/問題に注意してください）。
ただし、次の（一般的な）種類のビルドのみが提供されることに注意してください。

• ビルドは、最新のES- {version}とのみ互換性があります。つまり、ビルドされたファイルはBabelを介して実行されず、ポリフィルは含まれ
• ES5互換のビルド。つまり、ビルドされたファイルはBabelによって解析され、ポリフィルが含まれます。

最新のESとのみ互換性のあるビルド-{バージョン}

最新の2つの主要なブラウザバージョンでサポートされている機能/テクノロジーのみを使用することを尊重しますか？

新しいブラウザでサポートされていない超最先端の言語提案機能を備えたバージョンは役に立ちません。

最新の2つの主要なブラウザバージョンでサポートされている機能/テクノロジーのみを使用することを尊重しますか？

それには、 3つの異なるタイプのビルドを作成する必要がありますが、これは素晴らしいアイデアとは思えません。 1つは、ユーザーはどちらのビルドを使用するかについてさらに混乱する可能性があります（2種類のビルドだけでもユーザーが確信が持てないことを想像しているため）。 さらに、複数のビルドを提供しようとすると、いくつかの通常のPDF.js寄稿者に、サポートとメンテナンスの両方に関連するなど、より多くの負担がかかります。

基本的に、私に関する限り、この場合の望ましい状況は、図書館のユーザーが次のいずれかであるということです。

• ESの最新ビルドを選択し、サポートする必要のあるプラットフォーム/ブラウザーに基づいて、必要に応じてポリフィルを提供します。
• ES5ビルドを選択し、必要なすべてのポリフィルを含め、「すべての」最新のブラウザーと互換性のあるコードを取得します。

新しいブラウザでサポートされていない超最先端の言語提案機能を備えたバージョンは役に立ちません。

歴史的に言えば、Firefox Nightlyなどで機能が利用可能になった直後に機能を使い始めたことはないと思います。したがって、これが実際に大きな問題になるとは予測できません。

やあ、

私は同じ問題に遭遇しました、私が使用した解決策は再生器をロード-ランタイムは私のポリフィルを直接考えました。

このように私はpdfjs-distを変更しませんでした。 pdfjsを再コンパイルせずにCSPの問題を解決することができました:)

@makidelilleAngularを使用していますか？

@makidelilleAngularを使用していますか？

私たちはangularjsを使用します（まだ）。

正確には、angularjsディレクティブを通じて使用されるpdf.jsの上にカスタムビューアを構築しました

編集：カスタムビューアはtypescriptangularjsで構築されているため、ポリフィルがあります。

次のコード行から、CSSの別の安全でないインラインエラーが発生します。
https://github.com/mozilla/pdf.js/blob/master/web/ui_utils.js#L893

Refused to apply inline style because it violates the following Content Security Policy directive: "style-src ...". Either the 'unsafe-inline' keyword, a hash ('sha256-MW4Iy/yu3WipUpTMM/T6OjvUu9R6vUwutodlmYNo6qM='), or a nonce ('nonce-...') is required to enable inline execution.

やあ、

私は同じ問題に遭遇しました、私が使用した解決策は再生器をロード-ランタイムは私のポリフィルを直接考えました。

このように私はpdfjs-distを変更しませんでした。 pdfjsを再コンパイルせずにCSPの問題を解決することができました:)

あなた（または他の誰か）は、このソリューションがどのように角度2+に変換されるか知っていますか？ これを修正することは可能ですか？

私はこのライブラリを使用し

残念ながら、この問題がなかった古いバージョンのpdfjs（上記の2.1.266）は、このAngular 2+ラッパーライブラリと互換性がないようであり、そのバージョンのpdfjsを使用したバージョンはないようです。初めの。

編集：私と同じような状況にある人のために、CSPの問題なしで私のために働いた別の角度のあるpdfjsラッパーライブラリがあります。 こちらをご覧ください。

今後のリリースには2種類のビルドが含まれるため、この問題は今すぐ解決できると思います。

• バベルとし、いかなる含まpolyfillsなしtranspiledされていない、（最新のブラウザ用）現代のビルド。
• ES5互換のビルド（IE11などで使用可能）。Babelでトランスパイルされ、必要なすべてのポリフィルが含まれています。

いいですね！ @Snuffleupagusに感謝し、全員がこの：1st_place_medalに取り組みました。