path: root/files/ja/web/security/mixed_content/index.html

---
title: 混在コンテンツ
slug: Web/Security/Mixed_content
tags:
  - HTTP
  - HTTPS
  - Security
  - Web
  - console
translation_of: Web/Security/Mixed_content
---
<p>ユーザが {{Glossary("HTTPS")}} を通じてページにアクセスすると、ユーザとウェブサーバとの接続は {{Glossary("TLS")}} で暗号化され、盗聴や中間者攻撃から保護されます。<span class="seoSummary">HTTPS のページの中に通常の平文の HTTP で送られてくるコンテンツが含まれている場合、<strong>混在コンテンツ</strong>と呼ばれます。このようなページは部分的にしか暗号化されておらず、盗聴者や中間者攻撃者が暗号化されていないコンテンツにアクセスできてしまいます。</span>つまり、ページは安全ではありません。</p>

<h2 id="Types_of_mixed_content" name="Types_of_mixed_content">混在コンテンツの種類</h2>

<p>混在コンテンツには <strong>受動的な混在コンテンツ</strong> と <strong>能動的な混在コンテンツ</strong> の 2 種類があります。この 2 つは、中間者攻撃によってコンテンツが改ざんされた場合に、最悪のケースとして脅威が影響を与える度合いで区別されます。受動的な混在コンテンツにおける脅威は低いものとなります (誤解を招くコンテンツが含まれているか、ユーザのクッキーが盗まれている可能性があります)。能動的な混在コンテンツの場合、その脅威としてフィッシングや機密情報の漏えい、悪意あるサイトへのリダイレクトなどが想定されます。</p>

<h3 id="Mixed_passivedisplay_content" name="Mixed_passivedisplay_content">受動的な混在コンテンツ</h3>

<p>受動的な混在コンテンツは、 HTTPS のウェブページの中で HTTP 経由で送信されるコンテンツです。しかし、そのウェブページの他の要素を混在コンテンツから変更することは出来ません。 例えば、HTTP で送信された画像に対して、攻撃者は別の不適切な画像やメッセージへと差し替えてユーザに表示させることが出来ます。 また、攻撃者はユーザへ送信される画像を盗聴することで、ユーザの行動に関する情報を推測することが可能です。 なぜなら、画像ファイルの置かれている場所がウェブサイト中のある特定のページに固定されていることがままあるからです。もし攻撃者が特定の画像に対する HTTP リクエストを覗き見れば、ユーザが閲覧しているウェブページを特定することが出来るでしょう。</p>

<h4 id="Passive_content_list" name="Passive_content_list">受動的なコンテンツの一覧</h4>

<p>受動的なコンテンツとされる HTTP リクエストは以下の通りです。</p>

<ul>
 <li>{{HTMLElement("img")}} (<code>src</code> 属性)</li>
 <li>{{HTMLElement("audio")}} (<code>src</code> 属性)</li>
 <li>{{HTMLElement("video")}} (<code>src</code> 属性)</li>
 <li>{{HTMLElement("object")}} サブリソース (<code>&lt;object&gt;</code> が HTTP リクエストを送信したとき)</li>
</ul>

<h3 id="Mixed_active_content" name="Mixed_active_content">能動的な混在コンテンツ</h3>

<p><strong>能動的な混在コンテンツ</strong>は、その HTTPS ページのすべて、ないしは DOM の一部にアクセスできるコンテンツです。このタイプの混在コンテンツは HTTPS ページの動作を変更することができ、ユーザから機密情報を窃取することも可能です。従って、先程説明した受動的な混在コンテンツによる脅威に加え、能動的な混在コンテンツには他の攻撃ベクタへ向けた脆弱性が存在します。</p>

<p>能動的な混在コンテンツの場合、中間者攻撃の攻撃者はまず HTTP のコンテンツへのリクエストを横取りすることが出来ます。 その後、攻撃者はレスポンスを改ざんして悪意ある JavaScript コードを含めることも可能です。悪意ある能動的なコンテンツは、ユーザーのログイン情報を窃取したり、ユーザーに関する機密情報を取得したり、ユーザのマシンにマルウェアのインストールを試みることが出来ます (例えば、ブラウザーやそのプラグインの脆弱性を利用することが考えられます)。</p>

<p>混在コンテンツに関係するリスクは、ユーザが閲覧しているウェブサイトの種類と、そのサイトにどれだけ機微な情報が含まれているかに依存します。そのウェブページには世界中に公開されているデータもあれば、認証された時のみアクセスできる機密情報もあるでしょう。 もしウェブページが公開されていて機微なデータは何もなかった場合でも、攻撃者は能動的な混在コンテンツを利用することにより、ユーザを他の HTTP ページへリダイレクトさせたり、 HTTP cookie をサイトから窃取したりできてしまうのです。</p>

<h4 id="Active_content_examples" name="Active_content_examples">能動的な混在コンテンツの例</h4>

<p>能動的なコンテンツとされる HTTP リクエストのうち、代表的なものは以下の通りです。</p>

<ul>
 <li>{{HTMLElement("script")}} (<code>src</code> 属性)</li>
 <li>{{HTMLElement("link")}} (<code>href</code> 属性) (CSS スタイルシートも含む)</li>
 <li>{{HTMLElement("iframe")}} (<code>src</code> 属性)</li>
 <li>{{domxref("XMLHttpRequest")}} リクエスト</li>
 <li>{{domxref("GlobalFetch.fetch","fetch()")}} リクエスト</li>
 <li>{{cssxref("url")}} 値を用いる CSS すべて ({{cssxref("@font-face")}} /  {{cssxref("cursor")}} / {{cssxref("background-image")}} など)</li>
 <li>{{HTMLElement("object")}} (<code>data</code> 属性)</li>
 <li>{{domxref("Navigator.sendBeacon")}} (<code>url</code> 属性)</li>
</ul>

<p>Chrome と同様に、ウェブフォントやワーカーのようなリソースタイプも能動的なコンテンツとみなされます。</p>

<h2 id="Warnings_in_Web_Console" name="Warnings_in_Web_Console">ウェブコンソール内の警告</h2>

<p>閲覧しているページに混在コンテンツが含まれていた場合、Firefox のウェブコンソールには警告が表示されます。 HTTP 経由で読み込まれた混在コンテンツのリソースは赤色で表示され、このページへのリンクである「混在コンテンツ」の文字列が併記されます。</p>

<p><a class="internal" href="/files/12545/Mixed_content_-_Net_pane.png"><img alt="Screen shot of the web console displaying a mixed content warning." src="https://mdn.mozillademos.org/files/12545/Mixed_content_-_Net_pane.png" style="border-style: solid; border-width: 1px; height: 286px; width: 720px;"></a></p>

<p>これらの警告をウェブコンソールで見つけるのと同様に、 <a href="/ja/docs/Web/HTTP/CSP">Content Security Policy (CSP)</a> を使用して問題を報告することができます。 <a href="http://www.jitbit.com/sslcheck/" rel="noopener">SSL-check</a> や <a href="https://www.missingpadlock.com/" rel="noopener">Missing Padlock</a> のようなオンラインクローラーと使用すると、ウェブサイトを再帰的にチェックし、安全ではないコンテンツのリンクを探すことができます。</p>

<p>Firefox 23 以降より、能動的な混在コンテンツはデフォルトでブロックされるようになりました (受動的な混在コンテンツは設定によりブロック可能です)。ウェブ開発者が混在コンテンツのエラーに気付きやすくなるよう、ブロックされた混在コンテンツへのリクエストはウェブコンソールのセキュリティペインにすべて記録されます。</p>

<p><a href="/files/5261/blocked-mixed-content-errors.png"><img alt="A screenshot of blocked mixed content errors in the Security Pane of the Web Console" src="https://mdn.mozillademos.org/files/12543/mixed_content_webconsole.png" style="border-style: solid; border-width: 1px; height: 285px; width: 720px;"></a></p>

<p>このエラーを修正するには、 HTTP コンテンツへのリクエストをすべて HTTPS コンテンツへのリクエストに差し替えてください。よくある混在コンテンツには JavaScript ファイルやスタイルシート、画像、動画、その他のメディアファイルなどがあります。</p>

<div class="note">
<p><strong>注</strong>: Firefox 55 以降、 http://127.0.0.1/ で混在コンテンツの読み込みが許可されました ({{bug(903966)}} を参照)。 Chrome は http://127.0.0.1/ 及び http://localhost/ で混在コンテンツを許可しています。 Safari は混在コンテンツを許可しません。</p>
</div>

<h2 id="See_also" name="See_also">関連情報</h2>

<ul>
 <li><a href="https://w3c.github.io/webappsec/specs/mixedcontent/">Mixed Content - W3C Editor's Draft</a></li>
 <li><a href="/ja/docs/Security/%E6%B7%B7%E5%9C%A8%E3%82%B3%E3%83%B3%E3%83%86%E3%83%B3%E3%83%84/How_to_fix_website_with_mixed_content">混在コンテンツでブロックされるウェブサイトを修正するには</a></li>
</ul>

<p>{{QuickLinksWithSubpages("/ja/docs/Web/Security")}}</p>