外部scriptタグにintegrityハッシュを付ける

CDNのスクリプトは後で差し替わりえます。SRIハッシュがあればブラウザが改変ファイルを拒否します。生成手順です。

このガイドで使う道具

やりたいこと

Subresource Integrityは<script src>や<link>を正確なバイト列に固定します。CDNが別のものを配ればブラウザがブロックします。CDNが配る実ファイルのsha384/512 base64ダイジェストが必要です。

実バイトでハッシュ

実際のファイルをドロップします（保存し直したコピーではなく — 改行や圧縮が影響します）。sha384かsha512を選び、integrity値をコピーして、crossorigin="anonymous"と共にタグへ付けます。

  • integrity="sha384-…" — アルゴリズム接頭辞も値の一部です。
  • タグプレビューは汎用なので、実際のマークアップに属性を合流させてください。

壊れる時

ハッシュ不一致＝ブロックです — CDNの正当な更新でも止まります。URLをバージョン固定し（@latestではなくreact@18.2.0）、意図的な更新のたびに再ハッシュしてください。