コンテンツセキュリティポリシー

Webpackは、ロードするすべてのスクリプトに`nonce`を追加できます。この機能を有効にするには、`__webpack_nonce__`変数を設定し、エントリスクリプトに含めます。一意のハッシュベースの`nonce`が生成され、一意のページビューごとに提供されます（これが`__webpack_nonce__`が設定ではなくエントリファイルで指定されている理由です）。 `__webpack_nonce__`は常にbase64エンコードされた文字列である必要があります。

例

エントリファイル

// ...
__webpack_nonce__ = 'c29tZSBjb29sIHN0cmluZyB3aWxsIHBvcCB1cCAxMjM=';
// ...

CSPの有効化

CSPはデフォルトでは有効になっていません。対応するヘッダー`Content-Security-Policy`またはメタタグ`<meta http-equiv="Content-Security-Policy" ...>`をドキュメントと共に送信して、ブラウザにCSPを有効にするように指示する必要があります。CDNのホワイトリストに登録されたURLを含むCSPヘッダーの例を次に示します。

Content-Security-Policy: default-src 'self'; script-src 'self'
https://trusted.cdn.com;

CSPおよび`nonce`属性の詳細については、このページの下部にある**参考文献**セクションを参照してください。

信頼できるタイプ

Webpackは、信頼できるタイプを使用して動的に構築されたスクリプトをロードし、CSP `require-trusted-types-for`ディレクティブの制限に準拠することもできます。 `output.trustedTypes`設定オプションを参照してください。