Jaki jest cel atrybutu HTML "nonce" dla elementów skryptu i stylu?

Atrybut nonce umożliwia "białą listę" niektórych elementów inline script i style, unikając użycia dyrektywy CSP unsafe-inline (która pozwoliłaby wszystkim inline script/style), Aby nadal zachować kluczową funkcję CSP polegającą na wyłączeniu inline script/style ogólnie.

Tak więc atrybut nonce jest sposobem informowania przeglądarek, że wbudowana zawartość określonego skryptu lub elementu stylu nie została wstrzyknięta do dokumentu przez jakąś (złośliwą) stronę trzecią, ale została zamiast tego umieścić w dokumencie celowo przez osobę kontrolującą serwer, z którego dokument jest obsługiwany.

Https://developers.google.com/web/fundamentals/security/csp/#if_you_absolutely_must_use_it daje dobry przykład użycia atrybutu nonce, który sprowadza się do następujących kroków:

1. Dla każdego żądania, które serwer WWW otrzymuje dla konkretnego dokumentu, niech twój backend wygeneruje losowy łańcuch zakodowany base64 o wartości co najmniej 128 bitów dane z zabezpieczonego kryptograficznie generatora liczb losowych; np. EDNnf03nceIOfn39fn3e9h3sdfa. To twoje nonce.

2. Weź nonce wygenerowane w kroku 1, A dla dowolnego inline script/style Jeśli chcesz dodać "białą listę", upewnij się, że kod backendu wstawia atrybut nonce do dokumentu, zanim zostanie wysłany przez przewód, z tym nonce jako wartością:

   <script nonce="EDNnf03nceIOfn39fn3e9h3sdfa">…</script>
   

3. Weź nonce wygenerowane w kroku 1, prepend nonce- do niego, i spraw, aby twój backend wygenerował nagłówek CSP z tym wśród wartości listy źródłowej dla script-src lub style-src:

   Content-Security-Policy: script-src 'nonce-EDNnf03nceIOfn39fn3e9h3sdfa'
   

Tak więc mechanizm używania nonce jest alternatywą dla tego, aby twój backend generował hash zawartości inline script lub style, na które chcesz zezwolić, a następnie określał ten hash na odpowiedniej liście źródeł w nagłówku CSP.

Zauważ, że ponieważ przeglądarki nie sprawdzają (nie mogą), czy wartość nonce wysłana zmienia się między żądaniami strony, możliwe jest-choć całkowicie niewskazane-pominięcie 1 powyżej i nie pozwól, aby twój backend robił cokolwiek dynamicznie dla nonce, w takim przypadku możesz po prostu umieścić atrybut nonce ze statyczną wartością w źródle HTML dokumentu i wysłać statyczny nagłówek CSP z tą samą wartością nonce.

Ale powodem, dla którego nie chcesz używać statycznego nonce w ten sposób, jest to, że to w zasadzie zniweczy cały cel używania nonce na początku-ponieważ, jeśli miałbyś używać statycznego nonce jak to, w tym momencie możesz równie dobrze używać unsafe-inline.