SSL化したのに安全なサイトでないと出た場合に対処したこと

私の利用しているXSERVEではSSL化を無料で出来るようになってました。

そこで、二つのサイトをSSL化しました。ですが、ある時から、自分のサイトの二つでアドレスバーの所の緑の鍵にが点灯していたのです。

がついている意味は、「混在するコンテンツ」と呼ばれ、「http://」と「https://」が混在している部分があるという意味になります。どうして、こうなったのかわからなかったのですが、二つの対策をすると安全な接続である緑鍵マークに代わりました。今回は、実施した対策方法の紹介です。

SSLの説明
.htaccessにリダイレクト用のコードを追記する
まとめ

SSLの説明

まず、SSLの簡単なメモ記事です。

安全なサイトであるか、ないかの表示例から見ていきます。

2017年1月現在では、警告が表示されているサイトは一部のブラウザで、かつパスワードやクレジットカードなどの重要な情報を入力するページだけが表示されるようになっています。

Firefoxの場合の安全でない表示例

以下、firefoxのサポートからの引用文です。

: 赤線が引かれた錠前アイコンが表示されている場合、Firefox は安全でない要素をブロックしておらず、盗聴や攻撃に対して無防備であり、あなたの個人データはサイトから盗まれる可能性があります。

: 灰色の錠前アイコンにオレンジ色の警告アイコンが付く場合、Firefox は安全でないパッシブコンテンツをブロックしていません。攻撃者はページの一部を改変することが可能です。たとえば、誤解させるコンテンツや不適切なコンテンツを表示することはできますが、攻撃者がユーザーの個人データをサイトから盗むことはできません。

引用　https://support.mozilla.org/ja/kb/mixed-content-blocking-firefox

私のサイトの場合には2番目のマーク

で混在コンテンツサイトとなってました。

安全な接続の表示例

安全な接続の場合の表示です。firefoxの場合には、アドレスバーにあるの部分をクリックするとこのように出ます。

firefoxの場合です。

chromeの場合

これって良くみますよね。httpsとなってますね。　保護された通信って何なのでしょうか? それについて以下で少しだけ説明というかメモしてます。

SSL化のメリット

盗聴、パケットの防止
サイトの信頼性の向上
アクセス解析の精度向上
検索エンジンからの評価
なりすましの防止
ブラウザにおける表示方法変更への備え
セキュリティの強化

SSL化すると、自サイトのWebページをすべて暗号化されます。つまり第三者からパスワードやID、クレジットカード番号や住所等の個人情報などを読み取らせないようにするのです。SSL化を行うことにより、Webサイトのトップページから、暗号化されたプロトコルを使用した安全なコンテンツであることを示す「HTTPS」が表示されます。

Googleは、近い将来全ての「http://」のWebサイトに対して警告を表示するとことを公式に発表していますのでサイトの信頼性を得る為にもSSL化したほうが良さそうですね。

対策方法の検討

困った時には、Simplcityのわいひらさんのホームページで検索してみます。

すると、やはりサポートフォーラムでも同じ問題の人がいたようで、わいひらさんが解決策を色々と記事にしてくれてました。

WordPressサイトの内部リンクSSL対応（HTTPS化）をコードコピペでちょっと楽にする方法

以前、WordpressサイトをSSL化する手順を紹介しました。この中の工程で一番作業が面倒くさくて危険なの…

この中から、一つ目の対策として、functions.phpの編集を行いました。

functions.phpの編集

基本的にやることといったら、functions.phpに以下のコードを貼り付けるだけです。

WordPressの管理画面から外観→テーマの編集に　fumctions.phpがあります。

「内部リンク等のURLを表示前にPHPで置換する」ために、functions.phpに以下のコードを貼り付けます。

書き換えの前には、必ずバックアップを作成しておいて、不都合があった場合には直ぐに元に戻せるようにしておいてから行って下さい。

//コンテンツ内の非SSL URLを表示前にSSL化する
function chagne_site_url_html_to_https_ex($the_content){
  //httpとhttpsURLの取得
  if (strpos(site_url(), 'https://') !== false) {
    $http_url = str_replace('https://', 'http://', site_url());
    $https_url = site_url();
  } else {
    $http_url = site_url();
    $https_url = str_replace('http://', 'https://', site_url());
  }
  //投稿本文の内部リンクを置換
  $the_content = str_replace($http_url, $https_url, $the_content);

  //AmazonアソシエイトのSSL化
  $search  = 'https://images-fe.ssl-images-amazon.com';
  $replace = 'https://images-fe.ssl-images-amazon.com';
  $the_content = str_replace($search, $replace, $the_content);

  //バリューコマースのSSL化
  $search  = '//ad.jp.ap.valuecommerce.com';
  $replace = '//ck.jp.ap.valuecommerce.com';
  $the_content = str_replace($search, $replace, $the_content);
  $search  = '//ad.jp.ap.valuecommerce.com';
  $replace = '//ad.jp.ap.valuecommerce.com';
  $the_content = str_replace($search, $replace, $the_content);

  //もしもアフィリエイトのSSL化
  $search  = 'https://af.moshimo.com';
  $replace = '//af.moshimo.com';
  $the_content = str_replace($search, $replace, $the_content);
  $search  = 'https://i.moshimo.com';
  $replace = '//i.moshimo.com';
  $the_content = str_replace($search, $replace, $the_content);
  $search  = 'https://image.moshimo.com';
  $replace = '//image.moshimo.com';
  $the_content = str_replace($search, $replace, $the_content);

  //A8.netのSSL化
  $search  = 'https://px.a8.net';
  $replace = 'https://px.a8.net';
  $the_content = str_replace($search, $replace, $the_content);

  //アクセストレードのSSL化
  $search  = 'https://h.accesstrade.net';
  $replace = 'https://h.accesstrade.net';
  $the_content = str_replace($search, $replace, $the_content);

  //はてなブログカードのSSL化
  $search  = 'https://hatenablog-parts.com/embed?url=';
  $replace = 'https://hatenablog-parts.com/embed?url=';
  $the_content = str_replace($search, $replace, $the_content);

  //ここに新しい置換条件を追加していく

  // //のSSL化
  // $search  = '';
  // $replace = '';
  // $the_content = str_replace($search, $replace, $the_content);

  return $the_content;
}
add_filter('the_content', 'chagne_site_url_html_to_https_ex', 1);

Search Regexプラグインを用いてデータベースを置換の方法も書いてあったのですが、データベースを変換するので、結構リスクも多いとされていました。しかも、作業自体大変そうでしたので、私はfunctions.phpの編集の方を選択しました。

詳しくは、わいひらさんのページで確認して下さい。

参考WordPressサイトの内部リンクSSL対応（HTTPS化）をコードコピペでちょっと楽にする方法

簡単に上記の内容を説明すると、今まで「Search Regexプラグイン」を用いてデータベースを置換」していた作業をページが開かれる時に、「PHP側で投稿を表示する前に置換処理で変更する」コードを書いてくれたのです。時間にしてわずか0.0何秒かの世界なので表示スピードが遅くなるとか考えなくて良いと思います。