AWS Ubuntu18+Apache2.4のVirtualHostで構築したWordpressサイトをLet’s EncryptのCerbotでSSL化する方法

# 概要
* AWS EC2インスタンスで利用しているUbuntuでApache２.4のVirtualHostを使用して、既に一つのウェブサイトを運用しています。そこに第2弾のURL（サブディレクトリ）を追加したので、今回はそちらをCerbotを使ってSSL化しようという話です。
* WordpressをEC2に構築する手順を整理した以前の記事はこちら：
    * [WordpressをEC2インスタンスにインストールする方法（Apacheのバーチャルホスト設定方法・Wordpress用DB作成方法も解説）](https://qiita.com/Ryo-0131/items/a6dab55ea5b54b6e10b7)


## 環境
* Mac
    * 機種ID：MacBookPro18,3
    * macOS：Monterey
    * チップ：Apple M1 Pro
    * メモリ：16GB

## 前提
* サーバーはAWS EC2インスタンスで、OSはUbuntu 18.04.3 LTSです。
* 現行HPのドメイン第1弾を、`sample.com`とします。
    * こちらは既にSSL対応済みです。
* 追加するHPのドメイン第2弾を、`wp.sample.com`とします。
    * 第2弾は、WordPressを利用しています。まだSSL化していません。
* どちらも、お名前.comで以下のようにDNSレコード登録されています。
    * TYPE:A
    * TTL:300
    * VALUE:同じIPアドレス（EC2のパブリック IPv4 アドレス（=Elastic IP）と紐づいています）
* ウェブサーバーは、 Apache/2.4.29です。
* Let's Encrypt(レッツ・エンクリプト)でSSL証明書発行済みとします。
    * Let's EncryptはSSL証明書を無料で提供している認証局（CA）の一つです。ACME (Automatic Certificate Management Environment) プロトコルを使用して発行します。
    * Certbot（サートボット）は、ACME（自動証明書管理環境）クライアントの一つで、Let’s Encrypt®からも使用を推奨された信頼性の高いソフトウエア。サーボットを使うと、Let's EncryptからSSL証明書を自動的に取得し、ウェブサイトに適用することができます。
    * 証明書の有効期限は90日間なので、運用時はcron追加（定期的にスクリプトを実行）が必要だと思います。
* certbotはインストール済みとします。
    * 正常に完了していれば、ディレクトリ`/etc/letsencrypt/live/[コモンネーム]/`に証明書が自動保存されています。
    * ファイル名・設定ディレクティブ・説明については、以下の記事に表があるのでご参考ください。
        * 参考記事：[Let's Encryptを利用してApache 2.4サーバをHTTPS化する](https://qiita.com/ariaki/items/5680cb6da6223844af4e)

## （本来の）SSL化対応手順
* 以下、本来想定される手順です。ただ、自分の場合、うまくできなかったので、実際にできた手順は後述します。
* 以下のコマンドを実行します。複数候補ある場合、以下のように返ってくるので、今回は2を選びます。

```terminal
$ sudo certbot

Saving debug log to /var/log/letsencrypt/letsencrypt.log
Plugins selected: Authenticator apache, Installer apache

Which names would you like to activate HTTPS for?
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
1: sample.com
2: wp.sample.com
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Select the appropriate numbers separated by commas and/or spaces, or leave input
blank to select all options shown (Enter 'c' to cancel): 2
```

* すると、以下のように実行し始めます。

```terminal
Obtaining a new certificate
Performing the following challenges:
http-01 challenge for wp.sample.com
Waiting for verification...
Cleaning up challenges
Created an SSL vhost at /etc/apache2/sites-available/wpsample_homepage-le-ssl.conf
Deploying Certificate to VirtualHost /etc/apache2/sites-available/wpsample_homepage-le-ssl.conf
```

* そして、またどっちか選べと言われます。Redirectして欲しいので、2を選びました。
```terminal
Please choose whether or not to redirect HTTP traffic to HTTPS, removing HTTP access.
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
1: No redirect - Make no further changes to the webserver configuration.
2: Redirect - Make all requests redirect to secure HTTPS access. Choose this for
new sites, or if you're confident your site works on HTTPS. You can undo this
change by editing your web server's configuration.
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Select the appropriate number [1-2] then [enter] (press 'c' to cancel): 2
Redirecting vhost in /etc/apache2/sites-enabled/wpsample_homepage.conf to ssl vhost in /etc/apache2/sites-available/wpsample_homepage-le-ssl.conf
```

* すると、以下のようにCongratulations!と出てきます。これで成功ですね。
```terminal
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Congratulations! You have successfully enabled https://wp.sample.com

You should test your configuration at:
https://www.ssllabs.com/ssltest/analyze.html?d=wp.sample.com
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
```

* 以下でApacheを再起動し、めでたしめでたし...
```terminal
$ sudo service apache2 restart
```

* と思ったら、第2弾のURL（`wp.sample.com`）にアクセスすると、なぜか第1弾のURL（`sample.com`)に移行してしまいました。
* なんじゃ〜！？と焦りながらも、変更が加わった以下の二つのファイルをよく見ると、何だか第1弾のVirtualHostの方に上書きされているっぽいことがわかったので、調べながらいざ編集開始。

## 最終的にはこの形で正常にSSL化できます

```terminal
$ cd /etc/apache2/sites-available
$ sudo vi wpsample_homepage.conf
```

* `wpsample_homepage.conf`を以下のように編集します。
    * デフォルトは`000-default.conf`というファイルです。それをCOPYして編集していくのが一般的だと思います。


```conf
<VirtualHost *:80>
## 第1弾は省略
</VirtualHost>
<VirtualHost *:80>
    DocumentRoot /var/www/html/wpsample_homepage
    ServerAdmin sample@sample.com
    ServerName wp.sample.com
  <Directory "/var/www/html/wpsample_homepage">
     Require all granted
     AllowOverride All
  </Directory>
    ErrorLog ${APACHE_LOG_DIR}/sample_homepage-error.log
    CustomLog ${APACHE_LOG_DIR}/sample_homepage-access.log combined
RewriteEngine on
RewriteCond %{SERVER_NAME} =wp.sample.com
RewriteRule ^ https://%{SERVER_NAME}%{REQUEST_URI} [END,NE,R=permanent]
</VirtualHost>
```

* `[END,NE,R=permanent]`のところは、`[R=301,L]`と指定しても同じです。先ほどRedirectで2を選ぶとここに記載されるようになります。
    * permanentは、301 Moved PermanentlyのHTTPステータスコードを指定しています。リクエストされたページを新しいURLにリダイレクトするという意味では同じです。WSとドメインを紐づけるとこう表示されるのだと思います、ネットでは301の方が多いですね。AWSでは通常ELBなどを使いますが、アプリケーション側でリダイレクトルールを定義している場合は、`[END,NE,R=permanent]`が使用されることがあるようです。

```terminal
$ sudo vi wpsample_homepage-le-ssl.conf
```

* `wpsample_homepage-le-ssl.conf`を以下のように編集。
    * こちらも、第１弾のVirtualHostのところの`ServerAlias `や`SSLCertificateFile`の参照先が、第２弾の方になっていました。あれれ、どこでミスったんだろう...
    * ということで、以下のように編集。

```conf
<IfModule mod_ssl.c>
<VirtualHost *:443>
## 第１弾は省略
</VirtualHost>
</IfModule>
## ここからが第2弾
<IfModule mod_ssl.c>
<VirtualHost *:443>
        DocumentRoot /var/www/html/wpsample_homepage
        ServerAdmin sample@sample.com
        ServerName wp.sample.com

Include /etc/letsencrypt/options-ssl-apache.conf
ServerAlias wp.sample.com
SSLCertificateFile /etc/letsencrypt/live/wp.sample.com/fullchain.pem # 今回取得した証明書
SSLCertificateKeyFile /etc/letsencrypt/live/wp.sample.com/privkey.pem # 今回取得した証明書
</VirtualHost>
</IfModule>
```


* 以下でApacheを再起動すると、、、

```terminal
$ sudo service apache2 restart
```


* 第2弾URLのSSL対応`https://xxxxx.com`にアクセスすると、無事に表示されました！
    * SSLの鍵マークもついています！
    * もちろん、第1弾の方も正常に表示されます。
* ちなみに、`DocumentRoot`を何もしていない場合、デフォルトにルーティングされるので、以下の画面になります。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2710373/129d09b4-b2bb-00c0-3d39-426dc70b0fbe.png)


* また、第2弾はWordpressで実装していたので、Wordpressのプラグイン`Really Simple SSL`を事前に有効化していました(放置してましたｗ)。
    * 上記作業前の画面がこちら。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2710373/b724bcbb-f274-10d4-6882-00eb134a188e.png)

* 実施後は、以下のようにSSLが有効化済みであることがわかります。他にもやれってたくさんきていますが...笑
    
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2710373/c68516c0-1ebe-ab8a-eec5-17cd0355ef9e.png)

* また、一般設定の「WordPress アドレス (URL)」と「サイトアドレス (URL)」も自動でhttpsになっているはずです。
    * `wp.sample.com`は例ですが、以下のように切り替わっています

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2710373/cedfa310-e6e1-54f4-ddec-9c01a5822cd8.png)

* SSL対応はサーボットでできるので、WordPressのSSL有効化プラグインは不要ですね...
    * プラグインは、リクエストがあるたびに、動的に接続の都度 httpから httpsへ変換させるため、システムへの負荷を多少なりとも増やしてしまうことになるそうです
    * ただし、一部のプラグインやテーマによって生成されるHTTPのリソースがHTTPSに変更されないこともあるらしく、その場合は、`Really Simple SSL`のようなプラグインで自動的にHTTPSに変更する必要はありそうです。
* VirutalHostって便利ですよね。ネットを拝見すると最大10個のWordpressを一つのサーバーで動かしている猛者もいるらしく...自分みたいに二つ（それもサブディレクトリURLだったら）くらい一つのサーバーで運用している方はたくさんいそうですね。ただ、使用するサーバーのスペックやアクセス数やトラフィック量など様々な要因から考慮する必要があります。

## 参考記事
* [自宅サーバー、Ubuntu上のApacheのHTTPS（SSL）を有効化する](https://rarak.jp/20418)
* [Let's Encryptを使ったSSL証明書の導入手順](https://blog.senseshare.jp/encrypt.html)
* [Ubuntu 18.04 と Apache2.4 で Let’s Encrypt を利用して SSL 化する](https://blog.totsugeki.com/post-300/)