常時SSL化の設定をしたのに「保護された通信」が表示されない時はパスにHTTPが残っているのかも？

最近このブログを常時SSL化したのですが、ある程度設定を終えてHTTPSでアクセスしてみたのですが「保護された通信」が表示されなくて困ってましたが物凄く初歩的な事を忘れていました。

そもそも常時SSLとは？

SSL(エス・エス・エル)(Secure Sockets Layer)は、ネット上のデータの通信を暗号化して、データの盗聴や改ざんを防ぐ仕組みの事です。(特徴として、SSL化したページのURLはhttps://〜〜になります)

よく、ネットで買い物を行ったりする時に「アドレスバーに緑の鍵アイコンが付いてるのを確認してから情報を入力するようにしましょう」という話をよく聞きますよね。あの緑の鍵アイコンが付いているのが、SSLを導入しているページです。もし、SSLを導入していないページで買い物をしたり情報を入力して送信してしまうと、そのサイトの運営者に悪意は無くとも、悪意ある第三者によって情報を抜き取られたり、改ざんされてしまうのです。

今までは何か情報を入力するページのみSSL化するのが一般的だったのですが、最近は全てのページをSSL化する動きがあり、これを「常時SSL化」と言います。何も情報を入力しないならSSLにする必要無いんじゃないの？と思うかもしれませんが、全てのページをSSLにする事でCookieへの不正アクセスを防止する事ができます。

また、GoogleがHTTPSページ(SSL化したページ)を優先的にインデックスに追加すると公式に発表した事によって更に注目されました。やはりGoogleとしても安全なページをユーザーに利用して欲しいんですよね。

Google ウェブマスター向け公式ブログ

HTTPS ページが優先的にインデックスに登録されるようになります

https://webmaster-ja.googleblog.com/2015/12/indexing-https-pages-by-default.html

Google では常にユーザーのセキュリティを最優先に考え、長年にわたってウェブの安全性の向上やブラウジング体験の改善に取り組んできました。 Gmail 、 Google 検索、 YouTube では以前からセキュアな接続を実現しており、昨年は、検索結果での HTTPS URL ...

サイト内にHTTPのパスが残っていると駄目

さて、SSLの手続きを済ませたのにhttpsで接続しても「このサイトへの接続は完全には保護されていません」と表示されてしまいました。
いわゆる緑色の鍵アイコンが表示されていなかったのです。

ふと、Chromeのディベロッパーツールを開いてみるとコンソールにメッセージが来ていました。

どうやらページ内の画像パスが「HTTP」のままだというのです。という事でこの画像パスを「HTTPS」に置き換えていきます。

Search Regexで一括置換

僕が利用しているCMSはWordPressなので、「Search Regex」というWordPressプラグインを使用しました。このプラグインは記事の本文やコメントの内容を一括で置換する事ができるので画像やリンクのパスを一気に変更してしまうというわけです。

WordPress.org

Search Regex

https://ja.wordpress.org/plugins/search-regex/

Search Regex は、検索のための完全な正規表現をサポートし、WordPressに強力な標準検索機能と置き換え機能を追加します。 …

新規プラグインから検索するか、上記リンクからダウンロードしてサーバーにアップして、SearchRegexをインストールしましょう。
インストールし終わったら、WordPressの[ツール]内に[Search Regex]という項目が増えているので、クリックします。
(このプラグインで一度置換してしまうと元に戻す事が出来なくなるので、作業する前にバックアップを必ず取るようにしておきましょう。)

SearchRegexのページが開くので、それぞれ設定していきましょう。

ちなみに検索する文字列は「http://」だけにしてしまうと外部リンク等も全て取得してしまうので自分のサイトのリンクを入力するようにしましょう。

「Search」を押すと「Search pattern」に入力した文字列を探してリスト表示してくれます。
「Replace」を押すと、置き換えた際にどのようになるのかリスト表示してくれます。このボタンを押しても置換されるわけでは無いので注意が必要です。

「Replace & Save」を押すと特に何か表示されるわけではありませんが、置換が実行されます。

その他のロゴ等は手動で変更

その他の細かいロゴのパスやヘッダー画像は自分でさっと変更ます。Chromeにどの画像パスがHTTPのままなのか表示されるのでそれを見ながら変更していきました。

全てパスが変更し終わった頃にはちゃんと「保護された通信」になりました。