html integrity

HTML サブリソース整合性によるリソースの整合性チェック

HTML サブリソース整合性によるリソースの整合性チェック

この記事では、HTML サブリソース整合性 (SRI) 機能を使用して、Web サイトがロードする外部リソースの整合性を確保し、悪意のあるコードの挿入攻撃を防ぐ方法について説明します。

1. サブリソース整合性 (SRI) とは？

SRI とは、Web サイトがロードする CSS、JavaScript などの外部リソースの整合性を検証するためのセキュリティメカニズムです。 リソースのハッシュ値を事前に計算し、HTML に埋め込んでおくことで、ブラウザはリソースの取得時にそのハッシュ値と比較し、改ざんされていないかを検証します。

2. SRI の仕組み

SRI は、HTML の <link> タグや <script> タグに integrity 属性を追加することで使用します。

  • integrity 属性: リソースの期待されるハッシュ値を格納します。

ハッシュアルゴリズムには、SHA-256、SHA-384、SHA-512 などがあり、より安全性の高いアルゴリズムを使用することが推奨されます。

使用例


<link rel="stylesheet" href="https://example.com/style.css"
      integrity="sha384-oqExTbL1sQwpO+Y59F64/3Vs+sdA7uKYz2k9+IPR9vKNlqvW7H4qlgvp+2Z18g+">

<script src="https://example.com/script.js"
        integrity="sha512-h3+yK1rgIzYKni+9u2L/yqy1J1nLF/Z8n2LB+z6XQtS2m2j/V0uyE/LhmGYXlQE="
        crossorigin="anonymous"></script>

3. SRI のメリット

  • Web サイトのセキュリティ向上: 悪意のあるコードの挿入攻撃を防止します。
  • ユーザーエクスペリエンスの向上: リソースの読み込みエラーによる Web サイトの機能異常を回避します。
  • Web サイトの信頼性向上: ユーザーの Web サイトに対する信頼感を高めます。

4. SRI の使用方法

4.1. リソースのハッシュ値の生成

オンラインツールやコマンドラインツールを使用して、リソースのハッシュ値を生成できます。

オンラインツール

コマンドラインツール (openssl)

``` openssl dgst -sha384 -binary style.css | openssl base64 -A ```

4.2. HTML へのハッシュ値の追加

HTML コードの <link> タグや <script> タグに integrity 属性を追加し、生成したハッシュ値を指定します。

4.3. SRI 設定のテスト

Web 開発ツールを使用して、SRI 設定が有効になっているかどうか、リソースの検証が成功しているかどうかを確認できます。

5. ベストプラクティス

  • コンテンツ配信ネットワーク (CDN) の SRI サポートを使用する
  • すべての重要な外部リソースに SRI を使用する
  • 潜在的なセキュリティ上の脅威に対処するために、リソースのハッシュ値を定期的に更新する

6. ブラウザの互換性

SRI は、主要なブラウザの最新バージョンでサポートされています。

ブラウザ バージョン
Chrome 45+
Firefox 43+
Safari 10+
Edge 12+

SRI をサポートしていないブラウザでは、integrity 属性は無視され、リソースの読み込みには影響しません。

7. まとめ

SRI は、Web サイトのセキュリティを向上させるための重要な機能です。 開発者は、SRI を積極的に使用して、Web サイトの安全性を高めることを推奨します。

関連する Q&A

Q1: SRI を使用すると、Web サイトのパフォーマンスに影響がありますか？

A1: SRI を使用しても、Web サイトのパフォーマンスに大きな影響はありません。 ブラウザは、リソースのダウンロードと並行してハッシュ値の検証を行うため、読み込み時間が大幅に遅くなることはありません。

Q2: SRI は、すべての種類の Web セキュリティ攻撃を防ぐことができますか？

A2: いいえ、SRI は、すべての種類の Web セキュリティ攻撃を防ぐことはできません。 SRI は、リソースの改ざんを防ぐ効果的な手段ですが、クロスサイトスクリプティング (XSS) やクロスサイトリクエストフォージェリ (CSRF) などの他の攻撃を防ぐことはできません。

Q3: SRI を使用する場合、他に注意すべき点はありますか？

A3: SRI を使用する場合、リソースのハッシュ値を定期的に更新することが重要です。 リソースが更新されたにもかかわらず、古いハッシュ値を使用している場合、ブラウザはリソースの読み込みをブロックするため、Web サイトが正しく表示されなくなる可能性があります。