混在コンテンツのエラーを解決して、訪問者のWebブラウザがHTTPを経由して提供されるHTTP リソースをブロックしていないことを確認します。
概要
Cloudflareに追加されたドメインがSSL証明書を受信し、HTTPS経由でトラフィック処理をすることができます。しかし、Cloudflareの利用開始後、最初にHTTPSトラフィックを処理した時に、コンテンツが見つからなかったりページがレンダリングする問題に気づくお客様もいらっしゃいます。
通常、問題はHTTPS経由で提供されたWebページからのHTTPSリソースへのリクエストによるものです。例えば、ブラウザにhttps://example.comを入力すると、HTMLでHTTPを経由して<img src="http://example.com/resource.jpg">への画像参照がページに含まれます。
たいていの場合、WebサイトがHTTPS経由で全てのリソースを安全に読み込む場合、訪問者に向けて、ブラウザのアドレスバーにロックアイコン（通常、緑色のロック鍵）が表示されます。
これは、サイトに機能するSSL証明書があり、サイトで読み込まれたリソース全てがHTTPSで読み込まれます。緑色のロック鍵で、訪問者は接続が安全だと確認できます。混在コンテンツの兆候の一つとして、緑色のロック鍵ではない別のアイコンの表示があります。
混在コンテンツ発生の兆候
最新のブラウザは、保護されたHTTPSページ上でHTTPリクエストをブロックします。ブロックされたコンテンツには、ページの外観や動作に影響する画像、JavaScript、CSS、その他のコンテンツが含まれます。
以下は、Webブラウザがリクエストを受けたWebサイトに混在コンテンツがみられることを示しています。
- Firefox
URLの横に注意を喚起する黄色い三角形が表示されます： - IE (バージョン10)
「保護されているコンテンツだけが表示されます」という警告メッセージが表示されます。 - Microsoft Edge
「保護されているコンテンツだけが表示されます」という警告メッセージが表示されます。 - Chrome
URLの横に情報記号または警告記号が表示されます：
混在コンテンツ警告の場合、Webブラウザがリソースを読み込みますが、ユーザーはURLに緑色のロック鍵が見えません。警告メッセージはブラウザデバッグツール内で表示されます。
混在コンテンツエラーについては、ブラウザが保護されていない接続を介したリソースの読み込みを拒否します。
こうした問題を特定するためにブラウザのデバッグツールを使う方法に関する情報は、ChromeとFirefoxのドキュメントにあります。または、ページソースを表示し、 他のリソースへのパスのhttp://の特定リファレンスを見つけることもできます。
解決方法
混在コンテンツエラーの解決方法が二つあります。
1. HTTPプロトコル、またはHTTPSプロトコルかを特定せずに、HTMLソース経由で全てのリソースを読み込む。例：
//domain.com/path/to.fileを
http://domain.com/path/to.file
の代わりに
2. コンテンツ管理システムに応じて、自動的にHTTPソースからHTTPSに書き換えるプラグインをチェックしてください。 SSL/TLS アプリ「Edge 証明書」タブ内で、 Cloudflareは、HTTPの自動書き換え経由でこうしたサービスを提供します。