このブログはロリポップ！
を利用中のWordPressブログですが、この際HTTPS(常時SSL)に対応してみたので自分なりにメモしておいたものを共有してみたいと思います。
HTTPS化する理由
セキュリティ面でもいいし、見た目的にも「保護された通信」とブラウザに表示された方がこのブログを見てくれる人にも安心してもらえるし、微妙ではあるけれどSEO的にも有利ということもあって導入を決めました。
また、これまではHTTPSだとローディングが遅いイメージがありましたが、今ではテクノロジーの進歩のおかげなのかその心配も要らないほどスピードが改善しているように思います。それにすでに多くのウェブサイトが着々とHTTPS化されていくことが見えたので、自分もブログが大きくなる前にあらかじめ対応しておきたいと思ったわけです。
1. まずはロリポップ側の設定
まずはロリポップユーザー専用ページにログインして「セキュリティ＞独自SSL証明書導入」をクリック。
現時点ではまだSSL保護されていないことを確認し、SSL保護したいサイトにチェックを入れて設定ボタンを押す。
すると、SSL設定作業中と表示が変わるので、５分ほど待ちます。
５分ほど過ぎた後にページをリロードしてみると、このように「SSL保護有効」というステータスに変わります。
その後、早速アドレスバーに「https://hazukilab.com」と入力してみると、
このように「保護された通信」という表示と共に無事 httpsとしてサイトにアクセスできていることが確認できます。
なんかもう作業終わったー！って感じになりますが、本当はこれからです。（汗）
とりあえず、ロリポップ側の設定はこれで終わりです。
2. WordPress側の設定
次はWordPress側での設定が必要になりますが、その前に念のためWordPressのバックアップをしておきましょう。もしよろしければ以前の記事も併せて確認してみてください。
バックアップが終わりましたら、
「設定 ＞ 一般」に移動し、WordPressアドレス(URL)とサイトアドレス(URL)を確認すると、両方とも「http～」になっているので、これを「https～」に修正します。
次は、これまでに書いた記事の中に使われている数々の画像ファイルのURLや内部リンクの中の「http」を「https」に置換します。この作業を手動でやることは気が遠くなるほどの作業になるので、一気にまとめて置換してくれるツールプラグインを使用します。
早速インストール＞有効化した後は、「ツール ＞ Search Regex」に移動。
このように「http～」を「https～」に変えたい！と入力して「Replace & Save」ボタンをクリックします。この作業はDBを直接アクセスし置き換えてしまう作業なので、まだバックアップをとっていない方は必ずバックアップをとってから実行しましょう。
終わった後は、ちゃんと置き換えられているか確認するためにそれぞれの記事のHTMLを確認してみましょう。
↑http～だったがものが、
↑https～に変更されています。成功！
3. リダイレクトのために「.htaccess」ファイルの修正
これまでは 「http://～」でやってきたので当然Googleさんにも「http://～」でインデックスされています。HTTPS化した直後、Googleで自分のブログの記事を検索かけてみると当然ながら「http://～」で登録されていてクリックしてみると「http://～」のページに飛びます。これでは意味がありません。
自分のサイトがhttps化したことをGoogleが分かってくれてhttpsページをインデックスしてくれるまで時間がかかります。そのため、httpのページにアクセスがあった場合、強制的にhttpsページに回してくれる（リダイレクトしてくれる）措置が必要になります。
この措置は、サーバー上の「.htaccess」というファイルを開き、以下の文を追加することで可能になります。
自分はロリポップなので、ロリポップFTPにアクセスして編集しました。
.htaccessファイルをクリックし、編集画面で下記のコードを追加します。
Header set Strict-Transport-Security “max-age=31536000; includeSubDomains; preload”
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
</IfModule>
実際にはこんな感じです。
このようにコードを追加しておけば、最初httpで読み込まれたページもhttpsにリダイレクト(301)してくれるようになります。HSTSに関しては後ほど説明します。
[ad#in-article]
4. Googleアナリティクスの設定変更
管理 ＞ プロパティ ＞ プロパティ設定に移動し、デフォルトのURLをhttpsに変更します。
続いて、管理 ＞ ビュー ＞ ビュー設定に移動し、ビュー設定のウェブサイトのURLも変更します。
5. Google Search Consoleの再作成
Google Search Consoleはアナリティクスのように簡単にURLだけを変えることができないため、https用のプロパティを別途作成する必要があります。
プロパティを追加ボタンを押して 「https://～」のサイト名を記入します。
その後は指示に従って進めていけばOK。
無事にサイトの所有権が確認できればこのようにhttps用のプロパティが追加されるようになります。↓
その後はサイトマップを作成します。https用プロパティをクリックして、サイトマップをクリック↓
そして、サイトマップの追加/テストをクリック↓
sitemap.xmlと入力し、サイトマップを追加↓
「ページを更新する」を押します。↓
こうすることで、サイトマップリストにいま登録したサイトマップが表示されます。画像は登録してからまだ１日しか経っていないため、「インデックスに登録済み」が表示されないなど、時間がかかります。ちなみに作ったばかりのときは「アイテム」や「送信」の項目に何も表示されていませんでした。
登録して間もないときは「データがありません」とか「プロパティの処理が完了していません」とかでまともに表示されていない項目が多いですが、表示されるまでは時間がかかるそうなので、気長に待ちましょう。数日間待っていればいいかと思います。
6. プリロードHSTS設定
プリロードHSTSはhttpでアクセスしてきたブラウザに対して常にhttpsでアクセスするようにサーバーから通知を行い、その通知を受けたブラウザは次回からはhttpsを強制的に使用するようになるそうです。これでよりhttpsへの移行を完全なものにすることができます。
参考サイト：
https://www.blogging-life.com/hsts-preload/
まずは、上記の 3.「.htaccess」設定が必要です。
その後、「https://hstspreload.org/」にアクセスし、自分のサイトドメインを入力して申し込みます↓
そうすると、
Successと同時に、何週間かかるから待っててねーと言われるのでとりあえず待ちましょう。
※2018/2/13追記
登録してから約3週間後、ステータスが完了になりました。↓
HTTPS化してから３週間ほど経ちましたが、HTTPSにほぼ完全移行できたように思います。
最後に
いかがでしょうか？これで一通り、HTTPS化は完了です。後はhttpsでインデックスやHSTSの結果を待ちつつ、自分のサイトのあちこちを確認しながらhttpsで問題なくアクセスできているか確かめましょう。
ロリポップ！なら大人気のWordpressも簡単インストール！
あなたもWordPressでブログデビューしちゃおう！！
