ページに混合コンテンツがある場合、最初の HTML は安全な HTTPS 接続で読み込まれますが、他のリソース(画像、動画、スタイルシート、スクリプトなど)は安全でない HTTP 接続で読み込まれます。この名前は、1 つのページに HTTP コンテンツと HTTPS コンテンツが混在していることを表しています。
安全でない HTTP プロトコルを使用してサブリソースをリクエストすると、ページのセキュリティが低下します。これらのリクエストは、オンパス攻撃に対して脆弱です。この攻撃では、攻撃者がネットワーク接続を盗聴し、2 者間の通信を表示または変更します。攻撃者はこれらのリソースを使用してユーザーを追跡し、ウェブサイト上のコンテンツを置き換えることができます。アクティブな混合コンテンツの場合、攻撃者は安全でないリソースだけでなく、ページ全体を完全に制御できます。
多くのブラウザは、混在コンテンツの警告をユーザーに報告しますが、多くの場合、報告が遅すぎます。安全でないリクエストはすでに実行されており、ページのセキュリティが侵害されています。
ほとんどのブラウザでは、セキュリティ上の理由から混合コンテンツがブロックされるようになりました。安全でないコンテンツ リクエストを安全なコンテンツに変更して、ページが正しく読み込まれるようにします。
混合コンテンツの 2 つのタイプ
混合コンテンツには、アクティブとパッシブの 2 種類があります。
画像、動画、音声などのパッシブな混合コンテンツはページの他の部分とやり取りしないため、そのコンテンツをインターセプトまたは変更する場合の、中間者攻撃の実行内容は制限されます。
アクティブな混合コンテンツは、ページ全体を操作します。これには、スクリプト、スタイルシート、iframe、ブラウザがダウンロードして実行できるその他のコードが含まれます。アクティブな混合コンテンツに対する攻撃では、攻撃者はページに対してほぼ何でも行うことができます。
受動的な混合コンテンツ
パッシブな混合コンテンツはアクティブな混合コンテンツよりもリスクは低いですが、リスクは依然として存在します。たとえば、攻撃者は次のことを行えます。
- サイト上の画像に対する HTTP リクエストをインターセプトし、それらの画像をスワップまたは置き換えます。
- ボタンの画像を置き換えて、ユーザーが混乱し、保存しようとしたコンテンツを削除するなどの事態を招く。
- 画像をポルノ コンテンツに置き換えてサイトを改ざんする。
- 商品画像を他の広告に置き換える。
攻撃者がサイトのコンテンツを変更しなくても、混合コンテンツ リクエストを通じてユーザーを追跡できます。また、ブラウザが読み込む画像やその他のリソースに基づいて、ユーザーがアクセスしたページや閲覧した商品を把握することもできます。
パッシブな混合コンテンツが存在する場合、ほとんどのブラウザでは、ページ自体が HTTPS 経由で読み込まれている場合でも、ページが安全でないことを表すアドレスバーが表示されます。この動作は、こちらのデモで確認できます。
これまで、パッシブな混合コンテンツはすべてのブラウザで読み込まれていました。ブロックすると多くのウェブサイトが機能しなくなるためです。しかし、この状況は変わりつつあります。そのため、サイト上の混合コンテンツをすべて更新することが重要です。
場合によっては、Chrome がパッシブな混合コンテンツを自動的にアップグレードします。つまり、アセットが HTTP としてハードコードされているが HTTPS 経由で利用可能な場合、ブラウザは HTTPS バージョンを読み込みます。安全なバージョンがない場合は、アセットは読み込まれません。
Chrome が混合コンテンツを検出するか、パッシブな混合コンテンツを自動アップグレードするたびに、DevTools の [Issues] タブに詳細なメッセージがログに記録され、特定の問題の修正方法が提案されます。
![Chrome DevTools の [Issues] タブには、特定の混合コンテンツの問題とその修正方法に関する詳細情報が表示されます。](https://web.dev/static/articles/what-is-mixed-content/image/issues-tab-chrome.jpg?authuser=4&hl=ja)
アクティブな混合コンテンツ
アクティブな混合コンテンツは、パッシブな混合コンテンツよりも大きな脅威をもたらします。攻撃者はアクティブなコンテンツをインターセプトして書き換え、ページやウェブサイト全体を完全に制御できます。これにより、異なるコンテンツの表示、ユーザーのパスワードやその他のログイン認証情報の窃取、ユーザー セッション クッキーの窃取、ユーザーをまったく別のサイトにリダイレクトするなど、ページのあらゆる要素を変更できます。
アクティブな混合コンテンツのリスクが非常に高いため、ほとんどのブラウザでは、ユーザーを保護するために、このタイプのコンテンツはデフォルトでブロックされていますが、動作はブラウザ ベンダーとバージョンによって異なります。
このデモでは、アクティブな混合コンテンツの例を示しています。HTTP 経由でサンプルを読み込むと、HTTPS 経由でサンプルを読み込むときにブロックされるコンテンツを確認できます。ブロックされたコンテンツは、DevTools の [問題] タブにも詳細が表示されます。
![Chrome DevTools の [Issues] タブには、特定の混合コンテンツの問題とその修正方法に関する詳細情報が表示されます。](https://web.dev/static/articles/what-is-mixed-content/image/the-issues-tab-chrome-de-0eea9d1e99f11.jpg?authuser=4&hl=ja)
混合コンテンツの仕様
ブラウザは混合コンテンツ仕様に準拠しています。この仕様では、オプションでブロック可能なコンテンツとブロック可能なコンテンツのカテゴリが定義されています。
リソースがオプションでブロック可能なコンテンツとして分類される条件は、「混合コンテンツとして使用を許可するリスクが、ウェブの大部分を破壊するリスクを上回る場合」です。これは、パッシブな混合コンテンツのサブセットです。
オプションでブロック可能ではない混合コンテンツはすべてブロック可能と見なされ、ブラウザによってブロックする必要があります。
近年、HTTPS の使用が劇的に増加し、ウェブでのデフォルトになっています。これにより、混合コンテンツ仕様で必要に応じてブロック可能と定義されているサブリソース タイプであっても、ブラウザがすべての混合コンテンツをブロックすることを検討することがより現実的になりました。
古いブラウザ
古いブラウザを使用しているユーザーもいる可能性があります。ベンダーが異なるブラウザのバージョンによって、混在コンテンツの処理方法が異なります。最悪の場合、古いブラウザやバージョンでは混合コンテンツがまったくブロックされず、ユーザーにとって安全ではありません。
すべてのリソースを安全に読み込み、混合コンテンツの問題を修正することで、コンテンツを表示し、古いブラウザではブロックされない危険なコンテンツからユーザーを保護できます。