実は危険な「混合コンテンツ」！チェック方法から対策まで徹底解説！

内部施策・SEO周辺技術
2020-5-20
更新日: 2023-3-2
tomo.hiromitsu

皆さんは「混合コンテンツ」についてご存知ですか？
混合コンテンツとは、ドメイン自体は暗号化（SSL化）されているが、ページ内に暗号化（SSL化）されていないコンテンツが一部含まれている状態を指し、別名、混在コンテンツやMixed Content とも呼ばれています。
ご自身でサイトを管理されている方々の中には、どう対策したらよいのか分からない…なんて方もいらっしゃいますよね。
今回は今すぐ取り掛かれる、混合コンテンツの種類からチェック・対策方法までを解説します！

>>1,000社を超える多業種での実績あり！弊社のSEOコンサルティングについてはこちら

1 混合コンテンツとは
2 混合コンテンツの種類
- 2.1 パッシブな混合コンテンツ
- 2.2 アクティブな混合コンテンツ
3 混合コンテンツの危険性
4 混合コンテンツに対するブラウザの動き
5 Chromeからブロックされたら何が困る？
6 混合コンテンツに対して取るべき対策
7 まとめ

混合コンテンツとは

混合コンテンツとは一体何を指すのでしょうか？

ウェブサイトを開くとき、最初のHTMLは安全なHTTPS接続で読み込まれますが、画像や動画などのリソースが安全でないHTTP接続で読み込まれると、混合コンテンツが発生します。混合コンテンツと呼ばれる理由は、同じページを表示するためにHTTPとHTTPS両方のコンテンツが読み込まれているためで、セキュリティ上危険な状態だといえます。　HTTPSとHTTPの違いは下記の通りです。

HTTPS：暗号化(SSL化)された通信形式　※「S」＝ secure（安全な)
HTTP：暗号化(SSL化)されていない通信形式

HTTPSは第三者によるデータの悪用からサイトを守るため、今では、サイトをHTTPSに対応（＝SSL化）させることが一般的になりました。最新のブラウザでは、一部にHTTPを含んだ混合コンテンツ対して警告が表示され、このページに危険なリソースが含まれていることがユーザーに表示されます。

では、混合コンテンツにはどのような種類と脅威があるのでしょうか？

混合コンテンツの種類

混合コンテンツには、アクティブとパッシブの 2 種類があります。

パッシブな混合コンテンツ

パッシブな混合コンテンツには、画像、動画、音声コンテンツと、ページの残りの部分と対話できないその他のリソースが含まれます。
攻撃者はサイトの画像に対する HTTP リクエストを傍受して、それらの画像を入れ替えたり、置き換えたりすることができます。

例えば、攻撃者が保存ボタンと削除ボタンの画像を入れ替えた場合、ユーザーは意図せずコンテンツを削除してしまいます。製品の写真をわいせつなコンテンツや性的なコンテンツで置き換えた場合、サイトの評判が損なわれます。攻撃者がサイトのコンテンツを改ざんしなくても、重大なプライバシーの問題があります。攻撃者は、ブラウザにより読み込まれる画像などのリソースに基づいて、ユーザーがアクセスしたページや表示した製品を知ることができるのです。

アクティブな混合コンテンツ

アクティブな混合コンテンツには、スクリプト、スタイルシート、iframe、Flash リソースと、ブラウザがダウンロードして実行できるその他のコードが含まれます。
コードはページ全体に関係するため、攻撃者はそのページに対してあらゆる操作を実行できます。

例えば、まったく異なるコンテンツを表示したり、ユーザーのパスワードやその他のログイン認証情報を盗んだり、ユーザーのセッション Cookie を盗んだり、ユーザーをまったく異なるサイトにリダイレクトしたりすることができます。
この脅威の深刻さから、多くのブラウザがユーザーを保護するためにこの種のコンテンツを既定でブロックしていますが、ブラウザのバージョンによって異なります。

では、これらの混合コンテンツがあるとなぜ危険なのでしょうか？

混合コンテンツの危険性

ここで一度整理しておきましょう。

「混合コンテンツ」は、「HTTPSサイト内のHTTPコンテンツ」であり、HTTPサイト内のHTTPコンテンツは混合コンテンツとはみなされません。

HTTPサイト上のHTTPコンテンツは制限されないのに、HTTPSサイト上のHTTPコンテンツのみ「混合コンテンツ」として取り締まられるのを疑問に思う方もいるかもしれません。

これには明確な理由があります。攻撃者からウェブサイト訪問者を守るためです。

ブラウザからHTTPサイトにアクセスした場合は、「暗号化されていないため、安全ではないサイト」という理由で、ブラウザ側で多くの権限にあらかじめ規制がかかります。

しかし、HTTPSサイトの場合、「暗号化されているサイト」であることから多くの権限が許可されるよう設定されています。
安全であるはずのHTTPSサイトの中に、安全でない混合コンテンツがあるにもかかわらず、権限が許可される状態は非常に恐ろしいですよね。攻撃者が、暗号化されていないHTTPで読み込まれたコンテンツを介してサイトに侵入し、データを改ざんする危険性があるのです。

では、この脅威に対してChromeをはじめとするブラウザはどのように対応しているのでしょうか？

混合コンテンツに対するブラウザの動き

前述した脅威があるため、ブラウザですべての混合コンテンツをブロックすることが理想的です。しかし、そうすると、何百万人ものユーザーが毎日利用している多くのウェブサイトが台無しになってしまいます。
現在の妥協点は、最も危険な種類の混合コンテンツをブロックし、危険性が少ないものについては引き続き権限を許可するというものです。

Google Chromeは2019年10月、「段階的に」https：//ページが安全なhttps：//サブリソースのみをロードできるようにすることを開始することを発表しました。
Chrome 79以降の一連のステップで、Chromeは徐々にすべての混合コンテンツのをブロックするようにします。そして混合リソースをhttps：//に自動アップグレードします。そのため、サブリソースがhttps：//経由ですでに利用可能であれば、サイトは引き続き機能するといった内容です。

2020年4月6日に更新された最新情報によると、混合コンテンツの自動アップグレードは当初Chrome 81で予定されていましたが、少なくともChrome 84まで延期されるとのことです。しかし、デッドラインまで猶予はわずかなため、混合コンテンツがある場合は早めの対策が必要です。

<タイムライン>

Chrome 79・・・2019年12月リリース
Chrome80・・・2020年2月リリース
Chrome81・・・2020年4月リリース
Chrome82・・・すべてのチャンネルリリースをキャンセル(新型コロナウイルス感染症の感染拡大の影響)
Chrome83・・・2020年5月中旬リリース予定

>>1,000社を超える多業種での実績あり！弊社のSEOコンサルティングについてはこちら

Chromeからブロックされたら何が困る？

Chromeなどの各ブラウザは混合コンテンツブロックに向けて対策を進めていますが、ブロックされた場合ウェブサイト管理者の皆さんにとってどう影響するのでしょうか？

混合コンテンツへの対策が済んでいない場合、そのコンテンツはブロックされて非表示になります。たとえば、「サイト内の一部の画像や動画が読み込まれない」というような具合です。
日本におけるChromeのシェアは、ウェブブラウザの中でもトップクラスですよね。
サイト内容を正しく伝えられなければ、その分多くのユーザー体験に影響を与えますし、SEOの観点でもクオリティが下がるのは避けられないでしょう。
ウェブサイト側が受ける可能性がある影響を以下にまとめました。

Googleからの低品質評価を受け、ウェブサイト検索順位が下がるなどの影響
ユーザビリティの低下、安全面のリスクによってユーザーの離脱→集客機会損失
ECサイトでのコンテンツ販売への影響

では、具体的にどのように混合コンテンツを洗い出し、修正すればよいのでしょうか？

混合コンテンツに対して取るべき対策

では、早速混合コンテンツへの対策を進めていきましょう。
流れとしては３ステップです。
ご自身のサイトの混合コンテンツの有無のチェックをし、あるようなら該当箇所を表示させます。最後に修正して完了となります。

チェック方法

「サイト内に混合コンテンツがないか」を確認するには、まずChromeやFirefoxなどのブラウザーで開きアドレスバー(URLバー)に注目しましょう。

混合コンテンツがないサイトは、左側に鍵マークが表示されます。しかし、SSL化されていないサイトや、混合コンテンツがあるページは鍵マークは表示されません。

SSL化はレンタルサーバーで無料でできるところも多いので、万が一済んでいない場合は早急に対応しましょう。

原因となっている箇所の発見方法

ウェブブラウザ別に発見方法を見ていきましょう。

Chromeでの見つけ方

運営するウェブサイトにアクセス
Chromeデベロッパーツールを開く
画面上で右クリックして[検証]を選択、またはキーボードの[F12]を押す
上部メニューにある[Console]を選択
混合コンテンツ (mixed-content) がある場合は該当箇所が表示される

Firefoxでの見つけ方

運営するウェブサイトにアクセス
Firefox開発ツールを開く
画面上で右クリックをして[要素を調査]の項目をクリック、またはキーボードの[F12]を押す
[コンソール]をクリック
混合コンテンツ（mixed-content）がある場合は該当箇所が表示される

Safari（Mac OS）での見つけ方

運営するウェブサイトにアクセス
Safari ウェブインスペクタを開く
画面上で右クリックして[要素の詳細を表示]の項目をクリック、またはキーボードで[option]・[command]・[I]を同時に押す
[コンソール]をクリック
混合コンテンツ（mixed-content）がある場合は該当箇所が表示される

修正方法

修正方法は、WordPressをご利用かどうかで変わってきます。

WordPressを利用する場合

[http]から[https]へ自動的に置き換えてくれるプラグイン等の導入を検討してください。

WordPressでは、いろいろなプラグインが提供されていますが、「Really Simple SSL」「SSL Insecure Content Fixer」などが代表的です。

WordPress以外を利用する場合

[画像・動画・CSS・JavaScript]を読み込むURLのソースコードを直接　[http]から[https]へ修正してください。

[修正前]
“http://***********.com/*********.jpg”
[修正後]
“https://***********.com/*********.jpg”

※上記はあくまで一例です。記述例が異なる場合もありますので、ご注意ください。

他の方法で修正したいという方には、「Google開発者によるブログ」も参照いただくことをおすすめします。

まとめ

Googleはセキュリティ面の強化を目的として、Chrome内での混合コンテンツの排除を進めています。昨今SSL化が進んでいるにも関わらず、混合コンテンツがあるために自動ブロックの影響を受けてしまうのはとても残念なことではないでしょうか。
ユーザー獲得の機会損失を防ぐのはもちろん、セキュリティを強化するためにも、ご自分のサイトに混合コンテンツがないか早めにチェックしておきましょう。
現在最も利用されているブラウザであるChromeに加えて、他のブラウザもChromeの動きに追随する可能性が高いため、サイト管理者の皆さんは一刻も早い混合コンテンツ対策をお勧めします。

>>1,000社を超える多業種での実績あり！弊社のSEOコンサルティングについてはこちら

当サイトではこの他にもWebに関するお役立ち情報を多数ご紹介しています。
Web担当者の方、デジタルマーケティングに興味がある方はぜひご覧ください。

広告運用やSEO、解析・Web製作など、当社はWebに関わるベストソリューションをご提供しています。お悩み・ご相談も受け付けておりますので下記のボタンからお気軽にご連絡ください。

サービス資料はこちら無料相談はこちら