WordPressをhttps化(SSL接続)して、Googleに媚(こ)びてみた!

WordPressを全てhttpから、httpsで接続(SSL接続)すると、

1.表示スピードが速くなる。
2.サイトの信頼度が上がる。
3.SEO対策になる。

の3つのメリットがあります。

本ページでは、XSERVER&WordPress(テンプレートは「賢威」を使用)、Amazon CloudFront、 の環境で、CoreSSLを使用して、どのようにhttps(SSL接続)化するかを記載します。

Googleが「HTTPS をランキング シグナルに使用します」と発表したのは2014年8月なので、すでに2年が経過しようとしています。

また、その後2015年12月には「HTTPS ページが優先的にインデックスに登録されるようになります」と発表しています。

さらに、2017年1月から「Chrome 56」では、パスワードやクレジットカード情報を送信するWEBサイトで、httpsでない場合安全でないことを示すマークが表示される予定です。

さらにその後で、すべてのHTTPサイトで、警告アイコンと「Not Secure」という文字を表示することになる。

こういった流れからもWebサイトのHTTPS移行は避けられない状況ですね。

XSERVERで有料:独自SSLを設定する

参照:XSERVER オプション独自SSLのお申し込み

1.インフォパネルにログインして、「追加のお申し込みをクリック」=>規約に同意

2.オプション独自SSLの申込と記入項目

SSLブランドについて、選択方法

有料でも、基本的にはブランド「CoreSSL (料金:1,080円/年) 」で、SSLプランは SNI SSL(ネームベース) (初期設定費用:無料、利用料:無料)の選択で十分です。

無料で利用できる「Let’s Encrypt」(後述)
CoreSSL:上記よりセキュリティ強度がちょっと高く、対応ブラウザの幅が広い。XSERVERグループ企業
ラピッドSSL:シマンテックグループ・ジオトラスト株式会社のSSL
セキュアコア:サイトシール対応(Web ページ上に表示する画像ファイル。クリックして証明内容の詳細確認が可能)
ジオトラスト クイックSSLプレミアム:サイトシール対応。ジオトラスト株式会社のSSL。
グローバルサイン クイック認証SSL:国内シェアNo.1

基本的に企業ページであれば、CoreSSLから上。サブサイトや情報提供サイトであれば、Let’s Encryptでも可能。ネットショッピングサイトであれば、最低でもサイトシール対応から上という選択肢になります。

image106

対象サーバーとコモンネームの選択
image148

対象サーバーとコモンネームを選択して、一番下にあるをクリックします。

3.料金の支払いと認証作業

料金の支払い
「銀行振込」「クレジットカード決済」「コンビニ決済」「ペイジー」で、支払いを行ないます。カード・ペイジ-ならその先も速く進めることが出来ます。

認証作業を実施する
インフォパネルから、ご契約一覧 > SSL証明書のタグとすすみ「取得申請」をクリックします。

出てきた画面でCSR情報(SSL証明書申請情報)を 半角英数で入力していきます。

認証方法では、基本的にDNS認証が利用できれば、DNS認証します。
image115
今回の申請では、お名前.COMで管理し、WEBサーバーとメール運用(Googleビジネス)を分けているので、メール認証になりました。通常通り、XSERVERのDNSをドメイン管理している、ムームードメインなどで設定していれば、DNS認証が可能です。

メール認証の場合、下記のようなメールが届きますので、メールに従い認証作業を行ないます。

件名:【重要】your-brain.co.jp SSL証明書承認手続きのご案内(ORDER #24187269)

To 自分
このメッセージは、セキュアコアのSSL証明書の申請時に
選択された「承認用メールアドレス」宛に送信しております。

以下のコモンネームに対しSSL証明書が申請されました。

■コモンネーム
your-brain.co.jp

申請を承認する場合は、以下のURLにアクセスし、"validation code"を入力してください。
URL:<=専用URLの表示=>
validation code:<=入力するコードの表示=>

承認手続きに関するご質問やご不明な点は、販売代理店までお問い合わせください。
----------------------------------------------------------------------
セキュアコア株式会社
 https://www.securecore.co.jp

SSL証明書インストールの確認
Xserverから  【Xserver】SSL証明書設定完了のお知らせというメールが来れば設定が完了しています。
インフォパネルから確認すると、ステータスが有効になっています。
image153

XSERVERで無料:独自SSLを設定する

上に書いた、「XERVER独自」の「無料SSL」の設定は、サーバパネルから行ないます。
設定対象のドメインを選択した後に、SSLの設定を表示させ、独自SSLの追加を実施します。

設定をすると、しばらく保留状態になりますが、その後完了が表示されます。
image150

image151

image152

無料の独自SSL設定は、上記のステップだけで可能です。

WordPressをHttps://に対応させる

サーバー側の設定が完了したら、WordPressの設定です。

1.サイトアドレスの変更

設定 -> 一般で WordPressのアドレスと、サイトアドレスをhttps://に変更します。
image144

2.ページ内リンクの変更
サイト内に記載した、画像へのリンクや、他のページへのリンク先をhttps付きに変更します。
これは、プラグイン「Seaech Regex」を使うと便利です。

image154
image145

上記で行なってもよいのですが、WordPressのドメイン変更で使用するツール 「DATABASE SEARCH AND REPLACE SCRIPT IN PHP」というツールを使用すると完璧です。このツールは、WordPressの使用しているDB内部を検索し、すべてを適切に書き換えてくれます。このツールを使用後は、悪用を避けるために、すぐに削除しておきます。

image155

これで、WordPress自体の設定は完了デス。

.htaccessでリダイレクトさせる

最後に、外部からのリンク対応を行ないます。
http://でアクセスしてきている「直接入力」や、外部に張ってあるリンクに対応します。
また、検索エンジンの評価も引き継ぎます。

下記のコードを、通常のWordPressでのリライトとは、別に、.htaccessファイルに付け加えます。

<IfModule mod_rewrite.c>
RewriteEngine on
# === httpsに統一 ================================
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://your-brain.co.jp/$1 [R=301,L]
</IfModule>

これで、関連する直接の作業は完了です。

Googleサーチコンソール、Google Analiticsの設定変更

Googleサーチコンソールには、新たに、https://のアドレスを追加で設定します。

Google Analiticsでは、プロパティとビューの設定内容を変更します。
image146

image147

これで、すべての設定は完了です。

SSL関連知識

Google推奨のSSL強度テストサイト

はコチラ
https://www.ssllabs.com/ssltest/index.html

結構時間がかかります。
強度的には、問題有りませんでしたが、いくつかのふるいブラウザなどに対応していないので、評価がBとなりました。
img_57fc03421ecd7

https:は、なぜ速いのか?

本来、暗号化の分だけ遅くなるはずなのに、なぜ、表示スピードが体感的に速くなるか?
これは、Googleが開発したhttps用の「SODY」という規格があり、他のブラウザでも採用をしています。
このSPDYでは、多数のファイルを並行してダウンロードすることが可能となっています。

「OSS界のちょっと気になる話(7):次世代HTTP 2.0はSPDYの取り組みがベースに – @IT」より

https://www.httpvshttps.com/
どっちが速いか比較できます。