混在コンテンツ

Baseline Widely available *

This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.

* Some parts of this feature may have varying levels of support.

ウェブページが HTTPS などの保護されたチャネルを通じて保護されたオリジンから読み込まれる場合、ウェブサーバーとの接続は暗号化され、中間者攻撃による盗聴や改ざんから保護されます。 安全に読み込まれたウェブページに、保護されたオリジンでホストされている画像やスクリプト、その他のリソースのみが含まれている場合、ユーザーはページ全体がこれらの攻撃から安全であると確信できます。

「混在コンテンツ」とは、 HTTP または他の保護されていないプロトコルを使用して取得するリソースを使用する、安全に読み込まれたウェブページを指します。 この種のウェブページは潜在的に安全ではありません。保護されていない方法で送信されたリソースはすべて見ることができ、機密情報が漏洩したり、攻撃者によって変更されたりする可能性があるからです。 スクリプトは、ページのあらゆる側面を変更できるため、特に危険ですが、すべての種類のリソースには何らかのリスクがあります。 例えば、画像を変更してユーザーに誤った情報や誤解を招く情報を与えたり、ボタンの見た目の機能を変更したりすることができます。

「混在ダウンロード」とは、保護されたコンテキストから開始されたリソースのダウンロードを指しますが、安全ではない接続で取得します。 これらは、混在コンテンツと同じリスクを共有しています。ダウンロードは保護されたオリジンから始まりますが、途中で変更されたり、閲覧されたりしている可能性もあります。

ウェブサイトでは、混在コンテンツや混在ダウンロードを使用しないようにしましょう! ブラウザーは、画像、動画、音声の混在コンテンツのリクエストを自動的に HTTP から HTTPS にアップグレードすることで、混在コンテンツのリスクを軽減し、その他すべてのリソース形式に対しては、保護されていないリクエストをブロックします。 また、既定では混在ダウンロードもブロックします。

混在コンテンツの種類

ウェブページ内の混在コンテンツは、「アップグレード可能コンテンツ」と「ブロック可能コンテンツ」の 2 つのカテゴリーに分けられます。 ブラウザーは自動的に、アップグレード可能コンテンツのリクエストを HTTP から HTTPS にアップグレードし、ブロック可能コンテンツのリクエストをブロックします。

この手法により、保護されたコンテキストにあるすべてのコンテンツは、保護されたチャネル経由で読み込まれるか、ブロックされることが保証されます。これは、保護されたコンテンツと保護されていないコンテンツが混在する状態よりもユーザーにとって安全であり、保護されていないコンテンツをすべてブロックしてウェブページがまったく表示されなくなるよりも混乱が少ないといえます。

メモ: 以前のバージョンの仕様では、混在コンテンツを「ブロック可能」と「オプションでブロック可能」のカテゴリーに分類していました。

  • ブロック可能な種類のコンテンツは、「能動的な混在コンテンツ」とも呼ばれ、スクリプトやスタイルシートなど、ウェブページの他の部分を変更する可能性のあるものでした。 これらのファイルが変更された場合の潜在的なリスクはとても高く、ブラウザーはそれらをブロックすることが求められていました。
  • オプションでブロック可能な種類のコンテンツは、「受動的な混在コンテンツ」とも呼ばれ、ウェブページ内の画像、動画、音声ファイルなど、他のコンテンツを変更できないものでした。 これらのファイルを許可することによる潜在的なリスクは低かったため、ブラウザーはそれらをブロックするか表示するか、あるいはユーザーに判断を委ねるかを選ぶことができました。

「アップグレード可能コンテンツ」を構成する一連のリソース型は、「オプションでブロック可能な」混在コンテンツの一覧から選択されたものです。 今後、新しいファイル形式はすべてブロック可能なコンテンツとして定義され、一部のアップグレード可能コンテンツも将来的にブロック可能になることが予想されます。

アップグレード可能コンテンツ

アップグレード可能なコンテンツリクエストは、オリジンのスキームを http から https に変更することで、安全ではないリクエストが自動的に保護されたリクエストにアップグレードされます。 リモートサーバーは、リソースを返すか、または見つからなかったことを示すステータスコードを返します。

このカテゴリーのリソース型は、リクエストをブロックするとウェブの重要な部分が機能しなくなる可能性があるものです。 これらは現在、以前「オプションでブロック可能」であった混在コンテンツ型に該当します。なぜなら、これらのコンテンツ型は一部のウェブサイトで現在も使用されているからです。

次の要素はアップグレード可能です(URL ホストを IP アドレスとして指定する場合を除きます。次の節を参照してください)。

  • <img> でオリジンを src 属性で設定するもの、SVG 文書を含む(ただし、 srcset<picture> でリソースを設定する場合は含まない)。
  • CSS の画像要素。 background-imageborder-image、など。
  • <audio> でオリジンを src 属性で設定するもの。
  • <video> でオリジンを src 属性で設定するもの。
  • <source> で動画またはオリジンリソースを設定するもの。

ブロック可能なコンテンツ

ブロック可能なコンテンツは、「アップグレードできないすべての混在コンテンツ」と定義されています。

これには、次の要素から生じる HTTP リクエストが含まれます(このリストは網羅的なものではありません)。

URLのホストがドメイン名ではなくIPアドレスの場合、アップグレードされるはずの、混在コンテンツのリクエストはブロックされます。 つまり、 <img src="http://example.com/image.png"> はアップグレードされますが、 <img src="http://93.184.215.14/image.png"> はブロックされます。

混在コンテンツのリクエストの例

混在コンテンツのリクエストとは、保護されたコンテキストにおける保護されていないリソースのリクエストです。

次の例は、保護されたコンテンツ、保護されていないコンテンツ、および混在コンテンツのリクエストを説明しています。

  • http://insecure.comhttp://also.insecure.com を読み込む — どちらのオリジンも安全ではないため、混在コンテンツのリクエストではありません。
  • https://secure.comhttp://insecure.com を読み込む — これは混在コンテンツのリクエストです。安全ではないリソース http://insecure.com が保護されたコンテキスト https://secure.com に読み込まれるからです。
  • http://insecure.comhttps://secure.com<iframe> に読み込み、さらに http://also.insecure.com を読み込む — https://secure.comhttp://insecure.com に読み込むことは、混在コンテンツのリクエストではありません(保護されたコンテキストを保護されていないコンテキストに読み込むことに対する制限はありません)。 しかし、 http://also.insecure.com を保護されたフレーム https://secure.com に読み込むことは、混在コンテンツのリクエストです。
  • https://secure.comdata: URL をフレーム化し、http://insecure.com を読み込む — これは混在コンテンツのリクエストです。 https://secure.com (したがって、data:)は安全に読み込まれ、 http://insecure.com は安全ではないからです。

混在コンテキストのリクエストは、プラグインやワーカーなどの保護されたコンテキストからも行われ、同じ方法でアップグレード/ブロックされます。

ただし、保護されたコンテキストからのリクエストで、保護されていない最上位の閲覧コンテキストをターゲットとするナビゲーションリクエストは、リクエストのオリジンに関係なく、新しいコンテキストを作成し、そのコンテキストが保護されるかされないかになるので、混在コンテンツとは見なされないことに注意してください。

ローカルに配信された混在リソースの読み込み

ローカルリソースは、 HTTPS のオリジンと同様に、保護されたオリジンから取得されたものと見なされます。 これには file: URL、およびループバックアドレス(http://127.0.0.1/http://localhost/ など)からアクセスするコンテンツが含まれます。

これらのファイルは保護されたコンテキストから読み込むことができ、保護されたコンテキストのままになります。 しかし、ローカルファイルが http: 経由で保護されていないリソースを読み込んだ場合、それは混在コンテンツのリクエストとなります。

ローカルコンテンツの読み込みに対応しているかどうかは、ブラウザーの互換性の節で調べることができます。

混在ダウンロード

混在ダウンロードとは、保護されたコンテキストから保護されていない接続を介してリソースをダウンロードすることです。 これらは、混在コンテンツと同じ理由で問題となります。コンテンツは攻撃者によって介入されたり、変更されたりする可能性があり、ユーザーには保護されたサイトでこのようなことが現れる可能性があることが分かりにくくなります。

例えば、次のコードは、保護されていないオリジン http://example.com/ にあるページをダウンロードするために使用できる <a> 要素を定義しています。 このコードが HTTPS で配信されるページにある場合、リンクを保存すると、混在ダウンロードが発生します。

html
<a href="http://example.com/" download>ダウンロード</a>

ブラウザーは混在ダウンロードをブロックすることが望ましく、保護されたサイトには含めないようにすべきです。

メモ: ブラウザーは通常、既定では混在ダウンロードをブロックしますが、ユーザーにリスクを通知し、ダウンロードを維持するか破棄するかをユーザーに選択させます。

開発者コンソール

開発者コンソールには、混在コンテンツがアップグレードまたはブロックされた際に、警告が表示されます。 これにより、ウェブサイト上の混在コンテンツをデバッグし、修正することができます。

次のスクリーンショットは、 Firefox で画がをアップグレードされる際にコンソールに表示される警告を示しています(Chrome にも同様の警告があります)。

ウェブコンソールに表示された、混在コンテンツ画像のアップグレード警告のスクリーンショット。

「オプションでブロック可能」なコンテンツを表示するバージョンのブラウザーでは、コンソール警告とともに、表示コンテンツに混在コンテンツがあることを示すアイコンが使用されます。 次のスクリーンショットは、 Firefox がアップグレード可能な混在コンテンツに対応し始めたことを示すアイコンとコンソール警告を示しています。

ウェブコンソールに表示された、混在コンテンツ画像に関する警告のスクリーンショット。

混在コンテンツの問題の修正

混在コンテンツに関する課題を避けるための最善の策は、すべてのコンテンツを HTTPS で提供することです。

  • ドメイン内のすべてのコンテンツを HTTPS で提供する。

  • ダウンロードする場合を含め、ドメインでホストされているリソースへの参照をすべて相対リンクまたは HTTPS リンクに変更する。

  • 他のサイトのリソースを使用している場合、可能であれば HTTPS バージョンを使用する。

    ほとんどのサイトでは、共有リソースの HTTPS バージョンが指定されています。 最も簡単な手法は、 http:// のリンクをすべて https:// に置き換え、 LinkChecker などのツールを使用して、リンクがすべて正しく動作することを確認することです。

サイトに混在コンテンツがないことを確認する方法はいくつもあります。例えば以下のようなものです。

  • サイトを巡回し、ブラウザーの開発者コンソールで混在コンテンツの警告がないか調べます。
  • ブラウザー上のすべての混在コンテンツを無効にし、ページが期待通りに動作することを検査します。 これは Safari のでは既定の動作ですが、ほとんどのブラウザーは、すべての混在コンテンツをブロックする何らかの仕組みに対応しています(互換性データを参照)。
  • HTTPSChecker のようなデスクトップベースのウェブクローラー、または mcdetect のような CLI ツールを使用して、ウェブサイトを再帰的に調べ、保護されていないコンテンツへのリンクを探します。
  • Mixed Content Checker のようなオンラインツールを使用して、サイトを調べます。

仕様書

Specification
Mixed Content
# intro

ブラウザーの互換性

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
Blocks some or all insecure mixed content.
Allow mixed content from file: URLs.
Allow mixed content from localhost addresses (http://localhost/ and http://*.localhost/).
Allow mixed content from loopback address (http://127.0.0.1/).
Upgradable image mixed content by default.
Upgrade video and audio content by default.
Block mixed downloads.
Block 'blockable' mixed content.
User permission in private network allows mixed content checks to be skipped.

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
No support
No support
See implementation notes.

関連情報

  • CSP: upgrade-insecure-requests ブロック可能な混在コンテンツを含め、すべてのリクエストを HTTPS へアップグレードする