スクリプトおよびスタイル要素に対するHTMLの "nonce"属性の目的は何ですか？

Question

W3Cによると、HTML5.1には、Webサイトのコンテンツセキュリティポリシーで使用できるnonceおよびstyle用のscriptという新しい属性があります。

私はそれについてグーグルしましたが、ようやく実際にはこの属性が何をするのか、そしてそれを使用すると何が変わるのかわかりませんでした。

sideshowbarker · Accepted Answer

nonce属性を使用すると、CSPのunsafe-inlineディレクティブを使用せずに（allインラインscript/style）、特定のインラインscript要素とstyle要素を "ホワイトリスト"にしてCSキーを保持できます。インラインscript/styleを一般に禁止する機能。

そのため、nonce属性は、特定のスクリプトまたはスタイル要素のインラインコンテンツが、（悪意のある）第三者によってドキュメントに挿入されたのではなく、ドキュメントを管理するサーバーによって意図的にドキュメントに挿入されたことをブラウザに伝える方法です。から提供しています。

https://developers.google.com/web/fundamentals/security/csp/#if_you_absolutely_must_use_it はnonce属性の使用方法の良い例を示しています。

Webサーバーが特定のドキュメントに対して受信するリクエストごとに、バックエンドで暗号化された安全な乱数ジェネレータから少なくとも128ビットのデータのランダムなbase64エンコード文字列を生成します。例えばEDNnf03nceIOfn39fn3e9h3sdfa。それはあなたの臨時雇用者です。
手順1で生成したナンスを取り、「ホワイトリスト」するインラインのscript/styleについては、そのナンスを値としてワイヤに送信する前にバックエンドコードにnonce属性を挿入します。
```
<script nonce="EDNnf03nceIOfn39fn3e9h3sdfa">…</script> 
```
ステップ1で生成されたnonceを取り、それにnonce-を追加し、バックエンドにscript-srcまたはstyle-srcのソースリストの値の中にCSPヘッダーを生成させます。
```
Content-Security-Policy: script-src 'nonce-EDNnf03nceIOfn39fn3e9h3sdfa' 
```

そのため、ナンスを使用するメカニズムは、代わりにバックエンドに許可したいインラインscriptまたはstyleの内容のハッシュを生成させてから、そのハッシュをCSPヘッダーの適切なソースリストに指定する代わりの方法です。

ブラウザはページリクエスト間でnonce値が変更を送信したかどうかをチェックしない（できない）ため、上記の1をスキップしてバックエンドにnonceに対して動的に何もさせないことが可能です。静的な値を持つnonce属性をあなたのドキュメントのHTMLソースに入れるだけで、その同じnonce値を持つ静的なCSPヘッダを送ることができます。

しかし、そのように静的ナンスを使用したくないのは、まず最初にノンスを使用するという目的を完全に無効にするためです。なぜなら、そのような静的ナンスを使用するのであれば、その時点であなたはunsafe-inlineを使っているかもしれません。