ブログ運営

常時SSL化しているのに「保護されていない通信」が出る原因と解決法

サーバーの常時SSL設定(https化)はしているはずなのに、なぜか特定の記事だけ「保護されていない通信」が出てしまっているときの原因と解決法をまとめてみました。

 

問題発生時のブログの状況

サイトの常時SSL設定は有効にしているはずなのに、あるひとつの記事だけChromeアドレスバーに「保護されていない通信」と出ていました。

なんで?

サイト全体のSSL設定を間違えた?と考え、使っているエックスサーバーの設定を確認してみました。

 

SSL設定は間違いなく有効になっています。

 

ほかのページを確認してみると・・

 

インデックスアドレス

そのほかの記事たち

 

どうやらサイト全体のSSL設定がとれたのではなく、../archive/627の記事だけが「保護されていない通信」になっています。

原因:ページ内に「http://~」で始まるURLが混ざっていた

原因は、ページ内に「http://~」で始まるURLが混ざっていたせいでした。

 

今回の当ブログの犯人は、Cocoonスキンにデフォルトで入っている吹き出し要素「[SAMPLE 002] 女性」でした!

犯人はコイツだ!

 

この人の画像URLがhttpで始まっていたせいで、Chromeが「このページにhttpがいる!」と警告を出していました。

常時SSL設定しているのに「保護されていない通信」が出るときの原因チェック方法

ページのどこに「http://~」が隠れているか、Chromeの「検証」を使ってすぐに見つけることができます。

 

調べたいページで右クリックし、[検証]をクリックします。

出てきた右サイドバー上側の[Console]タブをクリックします。

黄色い背景色の部分が、ページ内の警告コンテンツを説明してくれています。ここを読めば、なぜ「保護されていない通信」という警告文が出ているのかが分かります。

 

今回のわたしのブログは、「ページはHTTPSで読み込まれているけど、HTTPで呼ばれてる画像があるよ。危ないよ」と言われています。

まとめ ページ内にhttp://~で始まるURLが混ざっていないか確認すべし

常時SSL設定をしているにも関わらずChromeが「保護されていない通信」と警告を出してくる原因は、今回のわたしの場合は「アドレスがhttpで始まる画像を使っていたせい」でした。

 

なぜか特定の記事だけ警告文が出る、というときは、ページ内検証をしてみてください。

 

また、当ブログと同じくCocoonスキンを使っているかたで、デフォルトの吹き出しを使っているかたは要注意です。

アイコン画像アドレスのhttpにsを書き加えるか、デフォルトから画像を変更するなどして対応してください。

ABOUT ME
とむ
うつ病4年目。新卒うつ病で退職したけど、今日も生きています。新卒うつ病休職や、うつ病転職など、これまでの経験からうつ病に役立つTipsを発信中。うつ病歴や職歴の詳しくはプロフィールをご覧ください。