SSL化したのにアドレスバーに「保護されてない通信」と表示される問題

SSL化したのにアドレスバーに「保護されてない通信」と表示される

どうも、スマコマのコマ太郎です。

昨日、サイトをSSL化(https)したのに、なぜかアドレスバーに「保護されてない通信」と出るというお問い合わせがありました。

保護されてない通信

chrome で見るとアドレスバーには、グレーで「保護されてない通信」と表示されており、クリックしエラー内容を見てみると、以下2つのパターンが発生していました。

SSLのセキュリティ警告

このサイトへの接続は完全には保護されていません

このサイトでは機密情報(パスワード、クレジットカードなど)を入力しないでください。悪意のあるユーザーに情報を盗まれる恐れがあります。

上記問題を解決したあと、アドレスバーの表示が変わりメッセージの内容も以下のように切り替わりました。

アドレスバーのセキュリティ警告 SSLのセキュリティ警告パターン2

このサイトへの接続は完全には保護されていません

このサイトで目にする画像は、悪意のあるユーザーによって差し替えられたものである可能性があります。

SSL化しているのに、灰色の文字で「保護されてない通信」と表示されるのはSSL化が不完全なときに起きる症状です。特にhttp:// で運営していて後からSSL化したケースで起こりやすいです。

ということで、どうやって解決したか書いておきます。

ちなみにSSL化が完全だとアドレスバーには下図のような鍵マークがつきます。目指すはこの状態ですよ。

SSL化が完了した場合

不完全なSSL化による「保護されてない通信」警告メッセージ

まず最初の次点でのメッセージがこちら。

このサイトへの接続は完全には保護されていません

このサイトでは機密情報(パスワード、クレジットカードなど)を入力しないでください。悪意のあるユーザーに情報を盗まれる恐れがあります。

クレジットカード情報を入れるなとか、怖いですね。これではサイトの信頼感も丸つぶれです。

今回のケースでは、サイト内で使われていた検索フォームのURLに問題がありました。WordPress のウィジェットに[検索]がありますが、これを追加していて、かつ WordPress の設定が不完全だと起こります。

WordPress標準の検索フォームのURLが問題のケース

WordPress の設定箇所

直し方は簡単で、WordPress の [設定]-[一般] にある [WordPress アドレス (URL) ] と [サイトアドレス (URL)] の両方が https:// になっているか確認してください。

当然、すでにSSL化しており、https:// でアクセスできている必要があります。 SSL化していないのに、https:// に変更すると WordPress にアクセスできなくなるので注意してくださいね。

変更したらサイトにアクセスして、スーパーリロード(Ctrl+F5キー)を1回実行してください。ブラウザによってコマンドが違うので、上手く行かないときは ↓ の記事をチェックしてみてください。

あわせて読みたい記事
ページの表示が更新されないときはスーパーリロードする
どうも、スマコマのコマ太郎です。 今日はブログを書く人には覚えておいてほしいブラウザの更新ボタン(F5キー)のお話です。 ブログのデ...

TCDテンプレートのGoogleカスタム検索を使っているケース

検索フォームネタとして、もう1つTCDテンプレートの検索フォームが引っかかっているパターンもありました。

TCDテンプレート(MAXX,RUMBLEなど)には、Googleカスタム検索(TCDバージョン)というウィジェットが用意されています。

Googleカスタム検索

これを使っていてもエラーが出ます。HTMLファイルのソースを見ると

<form action=”http://www.google.com/cse” method=”get” id=”searchform” class=”searchform”>

となっており、URLが http:// のままです。このウィジェットはコンポーネント化してTCDで使いまわしているのでしょうね。おそらくTCDのほとんどのテンプレートで同様の問題を内包していると思われます。SSLが標準でなかったときは良かったのでしょうが、SSL化が標準となった今は直してほしいものです。

対応として2つ。簡単なのは WordPress標準の検索ウィジェットに変更する。もう1つはテンプレートを修正するです。

TCDの修正するファイル

テンプレートの修正箇所

WordPress の [外観]-[テーマエディター(またはテーマの編集)] を開き、widget の下にある google_search.php をクリックします。

修正する箇所

TCDテンプレートを修正する

“http://www.google.com/cse” のプロトコル部分を s付きの “https://www.google.com/cse” に変更して保存するだけです。

保存したら直っているかサイトを開いて確認しましょう。スーパーリロード(Ctrl+F5キー)して確認してくださいね。

画像URLの修正が不完全、未実行な場合

続いて2つ目。今度は画像に問題があるという警告です。

このサイトへの接続は完全には保護されていません

このサイトで目にする画像は、悪意のあるユーザーによって差し替えられたものである可能性があります。

HTMLソースを見て、http://自分のドメイン/ で検索してみてください。たぶん、画像のURLがたくさん引っかかることでしょう。これはhttp://で運営していたサイトを後からSSL化するとよく起こる問題です。

ドメインをSSL化して、WordPress の設定を変更すれば SSL化は完了していると思っている人が多いようですが、記事やウィジェットに埋め込んだ画像URLは以前の http:// のままになっています。

これを修正してあげる必要があるのです。

記事、固定ページの画像はプラグインで一括置換する

使用するプラグインは、「Search Regex」です。

Search Regex

まずこのプラグインをインストールし有効化してください。プラグインのインストール方法が分からないときは、↓ 以下の記事を確認してください。

あわせて読みたい記事
どうも、スマコマのコマ太郎です。 今回は WordPress のプラグインのインストール方法を解説しようと思います。 まあ、正直、あ...

Search Regex の設定

Search Regex の設定

有効化すると WordPress の [ツール]-[Search Regex] に追加されるのでクリックして起動します。

[Search pattern] に古いURLを入力し、[Replace pattern] にSSL化した新しいURLを入力します。[Search] を実行すると、いくつかヒットすると思います。

(注意)次の操作は、戻せませんので、必ずバックアップを取ってから実行してください。バックアップ方法は以下の記事をご覧ください。

あわせて読みたい記事
どうも、スマコマのコマ太郎です。 今日は WordPress のバックアップと復元方法をご紹介します。 普段、あまり取らないバックア...

[Replace&Save] を実行すると実際に文字の置換が実行されます。実行したら直っているかサイトを開いて確認しましょう。スーパーリロード(Ctrl+F5キー)して確認してくださいね。

あわせて読みたい記事
search regex でエラーが発生
どうも、スマコマのコマ太郎です。 突然、「サイトで技術的な問題が発生しています」というメールがこのサイトから飛んできて、何だろうと思って内...

ウィジェットやテンプレート機能で埋め込んでいる画像

ウィジェットやテンプレート機能に直接画像URLを打ち込んでいる場合、Search Regex で置換することができません。地道に手で直してください・・・

どこに画像があるのかは、HTMLファイルのソースを見て、http://あなたのドメイン/ で検索して1つ1つ探してみてくださいね。地味ですが、結局、これが一番早いです。

SSL化されていないアフィリリンクの画像

あまりないと思いますが、外部の画像を直接ロードしている場合もURLはすべて https:// である必要があります。引っかかりやすいのが古いアフィリリンクのバナー画像やインプレッション画像です。

画像に https:// でもアクセスできるなら、Search Regex を使って、そのドメインを検索条件で一括置換すれば直ります。

保護されてない通信メッセージが表示される問題のまとめ

SSL化されているサイトをいくつかチェックしてみたのですが、驚くほどたくさんのサイトで「保護されていない通信」状態のまま放置されていました。

サイトのSSL化は証明書をインストールしただけではダメなのです。https:// でアクセスができるから完了していると思ってしまうのでしょうね。

SSL証明書、WordPress の設定、画像等URLの修正、あとこの記事では書いてませんが http:// から https:// への 301転送の4点セットで行う必要があるのです。

 コメント/質問、お気軽にどうぞ。

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

すぐ熱暴走するからグラボのファン交換をした

NVIDIA GTX750Tiチップ搭載のASUSのグラボが熱暴走するので798...

SQL STATE エラーで動かない

Search Replace DB V3.1 でSQLSTATE [2054] ...

search regex でエラーが発生

WordPress がプラグイン Search Regex でエラーを捉えました...

サイトアドレスを変更したらWPにログインできなくなった

WordPressのサイトアドレス変更後からログインできないときの対処法

WordPress で HTTPエラーが発生するとき

WordPressで画像をアップするとHTTPエラーが発生するときの対処法

問題を切り分ける

プラグインが機能しない!そんなときは問題を切り分けることから始める