さくらの VPS 上の Ubuntu で運用する WordPress を Rapid SSL で HTTPS 化した

いい加減このブログを HTTPS 化しようと重い腰を上げ作業に取り掛かった。

環境とバージョンは以下のような感じ。

さくらの VPS
Ubuntu 14.04 LTS
Apache 2.4
WordPress 4.8.2

以下作業ログ。思い出しながら書いてるので間違いあるかもしれない。

Rapid SSL の証明書を購入
1. SSL サーバ証明書の取得
Apache の設定
WordPress の設定変更
1. 混在コンテンツの解消
2. http から https へのリダイレクト
参考 URL

Rapid SSL の証明書を購入

利用する SSL はさくらの SSL で購入できる一番安い SSL サーバー証明書である Rapid SSL。2017年10月時点での値段は以下の通り

1年　1,620円
2年　2,916円
3年　3,456円

複数年契約で安くなるので3年を選択、ワイルドカードは利用できない為このブログのドメインである loumo.jp のみを対象として購入する。

まず購入の際に必要となる CSR ファイルを生成する。

$ openssl genrsa -des3 -out server.key.secure 2048
$ #もしくは
$ openssl genrsa -out server.key 2048

server.key という名前で秘密鍵が出来る。一つ目はパスフレーズ付き、2つ目は無し。どっちでも良いから生成する。暗号化したほうが安全なんだろうけどパスフレーズ入れるの面倒くさいので無しで生成した。ここで生成した鍵ファイルは CSR ファイルの生成及び Apache から呼び出す際に利用する。

というわけで以下のコマンドで CSR ファイルを生成する。

$ openssl req -new -sha256 -key server.key -out server.csr
...
Country Name (2 letter code) [AU]:JP
State or Province Name (full name) [Some-State]:
Locality Name (eg, city) []:
Organization Name (eg, company) [Internet Widgits Pty Ltd]:
Organizational Unit Name (eg, section) []:
Common Name (e.g. server FQDN or YOUR name) []:www.loumo.jp
Email Address []:
Please enter the following 'extra' attributes
to be sent with your certificate request
A challenge password []:
An optional company name []:

Country Name には国コード、日本なら JP を入れる。

Common Name には www 付きのドメイン名を入れる。自分の場合は www.loumo.jp となっているが、こうすると www.loumo.jp と loumo.jp の両方で SSL を利用できる。

それ以外の項目は特に何も入れる必要は無いようだ。

CSR ファイルを生成したらさくらの SSL にアクセスして Rapid SSL の購入を行う。

途中以下のような CSR ファイルを貼り付ける画面があるので先程生成した CSR ファイルの中身をコピペする。

このように右側にコモンネームなど設定した通りに表示されれば OK, 次へ進んで購入を完了させよう。

SSL サーバ証明書の取得

購入処理が完了しするとさくらインターネットからいくつかメールが来る。支払い確認のメールなどと少し遅れて「SSLサーバ証明書認証ファイルのアップロードについて」というメールが来るので、そのメールの内容に従って認証ファイルをアップロードする。

認証ファイルのアップロード方法は SSL 証明書を購入した時期によってやり方が異なるらしい。自分が購入した時は以下の通り。

会員メニューにログインし、「契約情報」の一覧から Rapid SSL の項目にある「サーバ証明書」をダウンロードする
ダウンロードしたファイルをコモンネームで指定したドメインの /.well-known/pki-validation/fileauth.txt にアップロードする
暫くすると自動的に認証が完了し証明書が発行される

例えば自分の場合は http://www.loumo.jp/.well-known/pki-validation/fileauth.txt でアクセスできるように配置すれば OK。

正常に配置できればさくらインターネットより「ジオトラスト SSL サーバ証明書発行のお知らせ」というメールが来る。メール内に何をやれば良いのかが書いてある。大体以下のような感じ。

会員メニューにログインし、「契約情報」の一覧から Rapid SSL の項目にある「サーバ証明書」をダウンロードする
ジオトラストより中間 CA 証明書のダウンロード
管理してるサーバへ SSL サーバ証明書と中間 CA 証明書をインストール

Rapid SSL を利用するにはジオトラストの中間 CA 証明書が必要らしい。ようは証明書を2つダウンロードしてサーバへ配置すれば良い。のだが Apache 2.4 からは中間 CA 証明書の指定方法が変更になり、サーバ証明書と中間 CA 証明書を合わせたファイルを作成する必要がある。と言っても中身は単なるテキストファイルなのでエディタでコピペすれば良い。

https://www.geotrust.co.jp/resources/rapidssl/repository/intermediate_sha2.html#b

Rapid SSL 用中間 CA はその発行日によって異なるものが用意されているので間違えないようにしよう。

サーバ証明書を開き、上記中間 CA の -----BEGIN CERTIFICATE----- から -----END CERTIFICATE----- までをコピーしてサーバ証明書に追記して保存する。ファイル名は何でも良いけど server.crt としとく。

これで必要なものは揃ったので次は Apache の設定を行う。

Apache の設定

まず SSL を使えるようにする。Ubuntu なので以下のようにする。

$ sudo a2enmod ssl
$ sudo a2ensite default-ssl
$ sudo service apache2 restart

一応この状態でもサーバに https でアクセスする事は可能なのだが、デフォルトの設定ではいわゆるオレオレ証明書が使われているのでそのへん直さないといけない。

まず証明書と秘密鍵を以下のように移動及びオーナーとパーミッションを変更する。

$ sudo chmod 600 server.key
$ sudo chown root:root server.key server.crt
$ sudo mv server.key /etc/ssl/private/
$ sudo mv server.crt /etc/ssl/certs/

次に default-ssl.conf 内で SSL 証明書の設定を書き換える。

SSLCertificateFile    /etc/ssl/certs/server.crt
SSLCertificateKeyFile /etc/ssl/private/server.key

これで Apache を再起動したら https でアクセスできる。Chrome なら「保護された通信」と表示されるはずだ。

WordPress の設定変更

https 化にあわせて WordPress の設定などを変更する。まずは一般設定の Wordpres アドレス(URL) とサイトアドレス(URL)を以下のように https に変更する。

これで https でアクセスできる。管理画面にもログインできるはずだ。

混在コンテンツの解消

恐らくただ WordPress の設定を https に変更しただけでは記事内等に http でアクセスしている箇所があり、混在コンテンツという扱いになると思う。なのでそれらを解消しなければならない。

記事であれば Search Regex プラグインを利用して一括で置換するのが良い。

正規表現が利用できる WordPress の検索置換プラグイン, Search Regex

あとは Web ブラウザのデベロッパーコンソールを開いて警告を一個ずつ潰していこう。

https のページで http の画像等をロードしているとこのようにコンソールに警告が出る。ここからどこでどのファイルが呼び出されているのかを確認して対象のファイルを編集していく。

http から https へのリダイレクト

最後に http から https へリダイレクトを行おう。これは .htaccess ファイルを変更する事で対応する。

<IfModule mod_rewrite.c>
RewriteEngine on
RewriteCond %{HTTPS} !=on [NC]
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
</IfModule>

これを .htaccess の先頭に書いておくと http へのアクセスを全て https へリダイレクトしてくれる。

参考 URL

以下の Web ページを参考にしました。

https://memocarilog.info/webdesign/8420

http://gihyo.jp/admin/serial/01/ubuntu-recipe/0387?page=1

https://qiita.com/bageljp@github/items/6b9876b7571852284ead

https://nelog.jp/wordpress-ssl

開発したアプリなど一覧