意外と簡単！EC2上のWebアプリを独自ドメイン化＆SSL化

[さようならFirefox Send。あなたは私のT4gインスタンスの中で永遠に生き続けます!!
](https://qiita.com/moritalous/items/4de26a290787ae732fd0)でEC2上にWebアプリケーションを構築しました。
欲が出て独自ドメイン化&SSL化をしてみました。

# ドメインの取得

freenomで`.tk`、`.ml`、`.ga`、`.cf`、`.gq`ドメインが無料で取得できます。
欲しい物を探してドメインを取得します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41574/b1bebded-ddce-0371-9b61-ee8e828ee7fe.png)

# Route53の設定（ホストゾーンの設定）

ホストゾーンを追加します。取得したドメイン名をパブリックホストゾーンとして登録します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41574/adf2f7a6-2598-6184-eb99-1c824e03bc72.png)

登録すると、NSレコードが作成されます。ここで4つのDNSサーバーのドメインが自動で指定されます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41574/25363f3a-91ff-bc13-6472-bd128a691304.png)

ここで指定されたドメインをfreenomに設定します。

Services -> My Domains
Manage Domains
Management Tools -> Nameservers
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41574/85118600-4f2c-a432-1ad0-29a66ad823af.png)

これでRoute53でドメインが管理されます。反映までに結構時間がかかります。

# ACM(AWS Certificate Manager)の設定

SSL証明書を発行します。
バージニア北部（us-east-1）リージョンを選択します。

証明書のリクエスト
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41574/82ba4ac4-d21d-c77d-3f9f-530ad22de908.png)

ドメインは`*.`を先頭に付けてワイルドカード証明書としましょう
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41574/040826ca-5c94-ed15-d4e3-c912e1baba31.png)

`DNSの検証`を選択します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41574/029df574-31ff-006e-7ef0-d71093318a3c.png)

次々進み、検証のところで、`Route 53でのレコードを作成`ボタンを押します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41574/1097b817-1ced-cf49-a49e-a296797018fb.png)

しばらくすると証明書が発行済となります。これもちょっと時間がかかります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41574/0757ee70-b47a-6492-a715-ca339e7a31fe.png)

# CloudFrontの設定
Create Distributionから作成を進めます。
WebのところのGet Startedを押します。

`Origin Domain Name`にEC2のパブリック IPv4 DNSを入力します。
`Origin ID`は自動で入力されますが、うまく入力されるときとされない時があります。。何度も`Origin Domain Name`を入れたり消したりしてるとそのうちうまっくいくと思います。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41574/9b681c3d-6113-abe2-30b5-a00010669daa.png)

`HTTP Port`と`HTTPS Port`をEC2で起動しているWebアプリに合わせます。（今回はHTTPが1443ポート）
`Viewer Protocol Policy`を`Redirect HTTP to HTTPS`に、`Allowed HTTP Methods`を`GET, HEAD, OPTIONS, PUT, POST, PATCH, DELETE`に変更します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41574/604fe702-d078-e009-aeda-82fe40b9225d.png)

`Origin Request Policy`を`Managed-AllViewer`にします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41574/e8f1a03a-c9fa-9438-903b-bc17febce252.png)

`Alternate Domain Names(CNAMEs)`に使用するドメイン名（moritalous.ga）を入力し、`SSL Certificate`を`Custom SSL Certificate`にしてACMで作成した証明書を選択します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41574/3fc0dff0-42b5-7ab9-e2bb-cd29eec47a26.png)

# Route53の設定（サブドメインの設定）

サブドメインの設定を行います。

ホストゾーンの選択 -> レコードを作成
`シンプルルーティング`を選択します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41574/7a508d78-4b09-f93a-aa48-99123e745f30.png)

`シンプルなレコードを定義`を押します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41574/c2b85029-a787-3ac7-eab8-8b592778fe88.png)

レコード名を入力し、`値/トラフィックのルーティング先`で`CloudFrontディストリビューションへのエイリアス`を選択し、作成済みのディストリビューションを選択します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41574/1bebbb93-0312-4a9b-99ff-6e8e47a549ba.png)

`レコードを作成`ボタンを押します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41574/5cf4bd2c-9129-4b87-78a5-3bc758a42a37.png)

設定は以上です。


# 動作確認

## CloudFront発行のURL(HTTPS)
OK
CloudFront発行の証明書が使用されています。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41574/6578a22b-2b32-92cb-c938-e94259e923fe.png)

## CloudFront発行のURL(HTTP)
HTTPSにリダイレクトされ表示。OK

## Route53発行のURL(HTTPS)
OK
こちらはACMで発行した証明書が使用されています。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41574/4c9e542c-9908-fd1e-8e80-5bbeb80acac9.png)

## Route53発行のURL(HTTP)
HTTPSにリダイレクトされ表示。OK

うまくいきました。