ELB + EC2 + Route53 + Certificate Manager + docker + nginx + php7.3 + wordpress + mysql5.7でSSL化したブログサイト環境の構築

# 経緯
 - HTTPSでのブログサイト構築までを簡単にできるようにしておきたかった。
 - ECS、EKSをこれから利用するにあたってその前にEC2へDockerで環境構築するための練習です。

# 利用するGitリポジトリ
 - https://github.com/ienokado/docker-wordpress-nginx.git

# 参考記事
 - [AWS EC2インスタンスにdockerとdocker-composeをインストールして簡単なWEBサービスを立ち上げる方法](https://qiita.com/y-do/items/e127211b32296d65803a)
 - [AWSを使って、無料でサイトを常時SSL化　全手順（EC2＋Word Press＋ELB＋Certificate Manager＋Route 53）](https://www.leon-tec.co.jp/blog/yoshida/7570/)
 - [ワードプレスをELBとNGINXでSSL（HTTPS）を使う場合の注意点](http://blog.livedoor.jp/kmiwa_project/archives/1072133009.html)

## Route53でホストゾーンの作成
AWSコンソールログイン後、以下メニューでドメインを取得してください。[^1]**※お金かかります。**
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/377903/9c74bcb3-04df-afa2-e723-d429a23ef6c3.png)

## Certificate ManagerでSSL証明書を発行
 - 上述したドメインに対してSSL証明書を発行[^2]

## EC2の作成（セキュリティグループの作成）
- EC2の作成では基本的には初期値で良いですが、セキュリティグループのルールを一応SSH接続は自分のグローバルIPアドレスからしかアクセスできないようにした方がよいかと。[^3]あとHTTP, HTTPSは追加。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/377903/3b1719e4-bc0f-a8e8-b803-efa53f40ee27.png)

## Elastic IPとEC2の関連付け
 - 「新しいアドレスの割り当て」ボタンから新しいIPアドレスを作成したインスタンスに関連付けする
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/377903/e98a0213-f29f-23ef-1cbb-80cffa75a438.png)

## ELBの作成（SSL証明書の設置とEC2への接続）
 - Application Load Balancerを選択して作成
 - リスナーへ HTTP / HTTPS を追加
 - アベイラビリティーゾーン:２つ以上選択。ELBとEC2を接続できる同じVPCに設定。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/377903/a188a6dc-0fc2-d08b-1abc-e2faa1f48610.png)
 - セキュリティーゾーンは作成したEC2同じセキュリティグループを設定
 - ターゲットグループ作成時に作成したEC２を登録する

## Route53でドメインとELBの関連付け
 - Route53で作成したドメインに対して上述で作成したELBをエイリアス先として設定する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/377903/416cc636-3f3a-a27b-1c33-85501575ef46.png)

## EC2に先ほど設定したEC２と関連付けたEIPを指定してSSH接続（鍵ファイルも指定）
```
$ ssh -I /path/to/keyfile ec2-user@XX.XX.XX.XX
```

## workspaceを作成
```
$ mkdir ~/workspace
$ cd ~/workspace
```

## yum update
```
$ sudo yum update
```

## dockerをインストール
```
$ sudo yum install -y docker
```

## dockerを起動
```
$ sudo service docker start
```

## docker 起動確認
```
$ sudo docker info 
```

## docker-composeをインストール
```
$ sudo curl -L https://github.com/docker/compose/releases/download/1.21.0/docker-compose-$(uname -s)-$(uname -m) -o /usr/local/bin/docker-compose
$ sudo chmod +x /usr/local/bin/docker-compose
```

## docker-compose インストール確認
```
$ docker-compose --version
```

## ec2-userをdockerグループに所属させる
```
$ sudo gpasswd -a $USER docker
```

## dockerデーモンを再起動する
```
$ sudo systemctl restart docker
```

## ログアウト
```
$ exit
```

## 再ログイン
```
$ ssh -I /path/to/keyfile ec2-user@XX.XX.XX.XX
```

## workspaceへ移動
```
$ cd ~/workspace
```

## Gitをインストール
```
$ sudo yum -y install git
```

## 用意したgitリポジトリをクローン
```
$ git clone https://github.com/ienokado/docker-wordpress-nginx.git
$ cd docker-wordpress-nginx
```

## wordpressを作成する
```
$ docker-compose up -d —build
```

# 結果
 - ドメインへアクセスする
 - インストール設定画面が表示されるので通常のWordpressと同様に実施
 - HTTPSアクセスの場合初期インストール時にCSSやJSがHTTPで読み込まれてしまい、デザインレイアウトが崩れる
    - wp-config-sample.phpの`require_once( ABSPATH . 'wp-settings.php' );`の手前に以下記述

```php

define('FORCE_SSL_ADMIN', true);
if (strpos($_SERVER['HTTP_X_FORWARDED_PROTO'], 'https') !== false) $_SERVER['HTTPS']='on';
```

 - DB接続の設定はdockerーcompose.ymlへ設定している内容を設定する ※接頭辞は自由
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/377903/99778e90-e989-471e-8372-be02132ba300.png)

# 所感
意外とややこしかったです。
もっとスマートなやり方がありましたら教えてくださいませ。
誰かの参考になれば嬉しいなと思ってます。


[^1]: [Amazon Route 53でドメインを購入する](https://dev.classmethod.jp/cloud/register-domains-route53/)
[^2]: [AWS Certificate ManagerでSSL証明書を発行する](https://hacknote.jp/archives/41112/)
[^3]: [グローバルIPアドレス確認](https://www.cman.jp/network/support/go_access.cgi) / コマンドではifconfig