SSL対応したのに「保護されていない通信」が消えないときの対処法

chromeではSSL対応していないとURLバーに「保護されていない通信」と表示されます。

SSL対応すると「保護されていない通信」が鍵アイコンに変わるのですが、ある条件により変わらない場合があります。

『SSL導入して内部リンクも全部httpsに直したのに「保護されていない通信」が消えない!?なぜ!?』

私は地方でWebデザイナーを9年ほどやっているものです。↑これはつい最近の私の気持ちです（笑）。

ちゃんと解決し「保護されていない通信」を消せましたので、同じ思いをしている方のために、SSL対応したのに「保護されていない通信」が消えないときの対処法を解説します。

結論：httpファイルを読み込んでいるから

そのソース内やリンクしている外部ファイル内のimgなどがhttpで絶対パス指定していると「保護されていない通信」が消えません。

まずはソース内に「http://」がないか検索しましょう。

aタグやコメントはhttpのままで問題ありませんが、imgやスタイルシート・javascriptなど外部ファイルをhttpで読み込んでいる場合はNGです。

外部サイトのimgへ直リンクしており、そのサイトがhttps対応していない場合はもうどうにもなりません。

そのファイルをダウンロードして自サイト内に置くことが可能であればそうしましょう。（もちろん許可を取ってからですよ。）

スタイルシート・javascriptへのリンクパスもhttpならNGです。

そして注意すべきはこのファイル内にhttpへのリンクがあってもNGということです。

スタイルシートやjavascriptではimgを指定する場合があります。そのパスがhttpを指定していると「保護されていない通信」と表示されてしまいます。

利用しているスタイルシートやjavascript内に「http://」がないか検索しましょう。

ただし、外部ファイルが複数ある場合1つ1つ探すのが困難な場合があります。
そんなときはhtml（またはphp）側を調整してみましょう。

まず念のためバックアップを取ります。

次にhtml内でスタイルシートやjavascriptを読み込んでいるタグを一部削除（またはコメントアウト）し、アップします。

「保護されていない通信」が消えたか確認します。

消えていなかったら別の箇所を削除していきます。

消えたらその削除したファイル内に「http://」がないか検索して探しましょう。

当たり前ですが、スタイルシートやjavascriptを削除すると崩れます。
できるだけ影響の少ない環境や時間帯で実施することをオススメします。

犯人は1ファイルとは限りません。複数犯の場合があります。
この場合1ファイルずつ削除していては「保護されていない通信」が消えません。

よって削除するときは一気に削除し、「保護されていない通信」が消えたら、少しずつ範囲を絞り込んでいくことをオススメします。

jQueryファイルを消したときに「保護されていない通信」が消えることがあります。この場合jQueryファイルが犯人のように感じるのですが、このファイルは犯人ではありません。

他のjQueryを使ったファイルが犯人です。逆に言うとjQueryファイルを消したときに「保護されていない通信」が消えたなら他のjQueryを使ったファイルを疑いましょう。

「保護されていない通信」が消えないときはhttpファイルを読み込んでいる可能性が高いです。

httpへリンクしているファイルがないかhtml・phpソース内だけでなく、それにリンクしているスタイルシートやjavascript内のソースもチェックしましょう。

ちなみに・・・当サイトはSSL対応していません。SSL対応する必要がないからです。お問い合わせフォームなど設置することがあればSSL対応すると思います。

以上、SSL対応したのに「保護されていない通信」が消えないときの対処法でした。

マンガでわかるホームページ作成