今皆さんがご覧いただいているこのページを始め、多くのWebサイトは複数の要素（リソース）によって構成されています。
その中でサブリソースは、主要なリソース（メインリソース、通常はHTML）から独立して読み込まれる追加のリソースを指します。これらサブリソースを用いることは、Webサイトのパフォーマンスを向上させる、コードの再利用性を向上させる、といった利点があることから、開発プロセスにも大きな影響があります。
サブリソースには、一般的に以下のような種類が含まれます。
サブリソースは多くの場合、CDN（Contents Delivery Network）を始めとした外部環境から外部リソースとして読み込まれます。
この際、外部リソースを差し替えられたり、改竄された際に不要、または不正なリソース読み込まないよう、適切にサブリソースを管理することが必要になります。
そこで注目されるセキュリティ対策がサブリソース完全性（Subresource Integrity、SRI）です。
※CDNについては【縁の下の力持ち『CDN』その仕組みとは？】でも解説しています。
例えば、CDNにセキュリティ侵害があり、読み込み元のサブリソースが改竄されてしまった場合の影響を考えてみましょう。
CDNにある読み込み元のサブリソースが改竄された場合、以下のような影響が考えられます。
これらは、メインリソースであるWebサイトそのものへのセキュリティ侵害ではないにもかかわらず発生する恐れがあります。
ここで有効な対策がサブリソース完全性です。
サブリソース完全性を用いることで、読み込むサブリソースのファイルの整合性を確認することができるため、CDNなどの外部リソースが改竄された場合に発生するセキュリティ上の問題から保護され、Webサイトの信頼性を確保することができます。
次の章で具体的な仕組みと実装方法を見てみましょう。
サブリソース完全性を実装するには、外部リソースを読み込むHTML要素に「integrity」属性を追加する必要があります。この属性には、リソースの整合性を確認するためのハッシュ値が含まれます。
手作業による設定手順は以下のようになります。
参考情報: W3C サブリソース完全性
2. HTML要素に「integrity」属性を追加
リソースを読み込むHTML要素に「integrity」属性を追加し、ハッシュ値を指定します。
```
<script src="https://example.com/cdn/script.js" integrity="sha256-xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"></script>
```
■ 注意
サブリソース完全性を利用する場合、対象リソースのバージョン管理規則に注意ください。一般的なCDN上のリソースはバージョン管理により、リリース後のハッシュ値は固定のため、問題ありません。一方で、適切にバージョン管理されず、当該URLの外部リソースが変更される場合にはハッシュ値が変動し、サブリソース完全性によりリソース読み込みに失敗するため、注意が必要です。
このように、Webサイトにおいてサブリソースを使用することは多くの利点を享受することができます。
しかし一方で、サブリソースを外部リソースから読み込むことが一般的であり、CDNなどの外部リソース読み込み元にセキュリティ侵害があった場合に、改竄された不正なリソースを読み込んでしまうことによるWebサイトへのセキュリティ上の懸念があります。
サブリソース完全性を用いることは、CDN改竄対策から保護するための効果的な手段です。セキュリティを向上するために、サブリソース完全性を含めたサブリソースの適切な管理を検討しましょう。
お見積り・ご相談など、お気軽にご相談ください
サイトTOPへ
