01
実際に配るファイルを選ぶ
テキスト入力はUTF-8へ変換して計算します。配信ファイルには末尾の改行などが残るため、確定したファイルを選ぶほうが確実です。
Web Security Config
SRIハッシュ生成公開するバイト列をそのまま照合
コードを貼り付けるかファイルを選択。URLはタグの記述だけに使います。
SRIハッシュ生成
入力する内容
テキストはUTF-8、ファイルは元のバイトで計算します。
SRIの結果
内容はブラウザー内で処理し、URLには接続しません。
設定
ファイルは20 MiBまで、テキストは100万UTF-16単位まで。
テキストを入力するかファイルを選んでください。
SRIハッシュ生成は、CDNから読むスクリプトやCSSを特定の内容に固定したいときに役立ちます。ファイル名にバージョンがあっても、配信される中身が同じとは限りません。
サブリソース完全性では、通常の十六進数のチェックサムをそのまま使えません。最終的に配信するファイルを選ぶと、改行やBOMも含む元のバイトからBase64の値を作れます。
SRIハッシュ生成を使う理由
入力した内容と公開するタグの関係を明確にします。
最終ファイルを基準にする
SRIハッシュ生成は選んだファイルのバイトをそのまま読みます。文字列入力で起こり得る改行の違いを避けられ、URLから別のリソースを取得して基準にすることもありません。
公開済みの値を照らし合わせる
選択中の方式と同じ既存のintegrity値を一つ入力すると、一致か不一致が分かります。入力を変えた後は結果が古くなり、コピーできません。
配信前に確認したい三つの点
02
方式と照合値をそろえる
初期値はSHA-384です。既存の値は同じ方式の単一トークンだけ受け付け、方式を切り替えたら再計算が必要です。
03
タグとCORSを別々に確かめる
URLを入れるとscriptまたはstylesheetタグを組み立てますが、接続はしません。外部配信先のCORS応答は実際のブラウザーで確認してください。
要約値からHTMLタグまで
仕様どおりの形式
SRIハッシュジェネレーターとしてsha256・sha384・sha512の接頭辞とBase64を出力します。十六進数の普通のファイルハッシュとは区別できます。
手元の値を照合
integrity属性から取り出した単一の値と現在の内容を比較します。形式が正しいのに異なる場合は、計算失敗ではなく不一致として示します。
二種類の外部リソース
scriptと<link rel="stylesheet">を選べます。URLはHTML属性としてエスケープし、crossorigin="anonymous"も入れます。
途中で取り消せる
最大20 MiBのファイルはWorker内で処理します。キャンセルや入力変更後の古い結果は、コピーもダウンロードもできません。
計算対象と対象外の範囲
- URLは取得しない
- URL欄はタグのsrcまたはhref用です。CDNで現在配っている内容やCORSヘッダーは調べないため、配信後に別途確認が必要です。
- 複数トークンは照合しない
- ブラウザーは異なる方式が並ぶ場合、最も強い方式を優先します。この画面は誤った「どれか一つが一致」の判定を避けるため、単一の値だけを受け取ります。
- 更新後は作り直す
- ビルドやCDN側の変換、ライブラリー更新でバイトが変われば以前のintegrity値は使えません。最終成果物から再生成してください。
- 入力上限と対象
- ファイルは一つ20 MiBまで、テキストは100万UTF-16単位まで。MD5・SHA-1、URL取得、ディレクトリー一括処理、コードの安全性判定は行いません。
SRIハッシュ生成のよくある質問
生成したintegrity値は別のファイルにも使えますか？
使えません。SRIハッシュ生成は内容のバイト列から値を作るため、別のファイルには別の値が必要です。同じ名前でもビルド後に内容が変われば再生成します。
SRIにはどのハッシュアルゴリズムを選べばよいですか？
標準で認められるSHA-256、SHA-384、SHA-512から選びます。ここではSHA-384を初期値にしていますが、既存のビルド設定に合わせることもできます。
SRIハッシュ生成の処理はブラウザー内だけで完結しますか？
はい。貼り付けた内容と選んだファイルはこのタブ内で計算します。URL欄のアドレスにもアクセスしません。
インターネット接続がない状態でも使えますか？
ページが表示済みなら計算自体はネットワークを使いません。ただしページの初回読込や必要な配信ファイルには接続が要る場合があります。
タブを閉じたあと、入力した内容は残りますか？
入力はこの画面のメモリーだけに置き、保存機能はありません。タブを閉じるか更新した後はファイルを選び直してください。
説明で解決しない点がありますか？