SSL証明書をサーバーにインストールし、ポート 443 を開放して https での通信を許可した後、実際にサイトを見てみると「保護された通信」になっていない事があります。
確認すること
http://～でソースファイル（画像、css、js など）を読み込んでいないか
https 通信を行っているサイトから http でソースファイルを読み込んでしまうと、エラーが起きてしまいます。読み込むすべてのファイルがセキュアになっていなければならないからです。
これらは css でのbackground: url(http://～)のような url 指定だったり、js ファイルから http でファイルを読み込んだりしている時も発生します。使っているソースファイルは全て確認します。
①http:// で始まるパス
https:// に置換する。
ただこの時、読み込み先の外部サイトが SSL 化されておらず http:// でないとファイルを読み込めないこともあります。その時は、
- そのファイルをローカルに保存し、相対パスで読み込む
- 保護された通信はあきらめる
くらいしかありません。
②スラッシュ+ドメイン名で始まるパス
→ 例えばsrc="/sample.com/..."というパスであれば、スラッシュ二つ（//sample.com）で開始するか、 https:// に置換しましょう。src="/sample.com/..."のように、スラッシュ一つとドメイン名から始まるパスは http として読み込まれます。スラッシュを二つ（//）付けると、https 通信が使えればそちらを使い、使えなければ http で取得してくれるので便利です。
それでも保護された通信にならない時
読み込んでいるソースファイルを全て置換したのにも関わらずコンソールにエラーが出てしまう時は、リダイレクトを疑います。よくある例としてファビコンがあります。
ファビコンは、ブラウザのタブ等の左側にあるサイトを識別しやすくしてくれるアイコン画像のことですが、こちらは通常 head 内に画像へのパスを書いて設定します。しかし、ブラウザではパスを書いていなくても favicon.ico 自動で読み込もうとしてくれるのです。
もちろん、対象の（favicon.ico）が存在しなければ 404 エラーとしてコンソール内にメッセージが出てきます。ここまでは良いのですが、そのサイトで「404 のファイルを全てをトップへリダイレクトさせる」といったような事を行っていると…
- favicon.ico を自動で読み込みに行く
- favicon.ico は「存在しないファイル」なので、トップページへリダイレクトさせる
- この時に https にリダイレクトさせていないと、http でトップページを読み込もうとするため、混在コンテンツのエラーになる
そのため、エラーメッセージには「https のサイトで http://sample.com を読み込もうとしています」といったような分かりにくいメッセージが表示されることになります。これは favicon.ico に限った話ではなく、存在しないソースファイルを読み込もうとした時に同じようにリダイレクト設定していれば起こりえます。
