【　Ruby on Rails 6.0　】 AWS + Nginx + Unicornでデプロイ⑧

# 始めに
Railsアプリを本番環境にデプロイさせる工程は今回の内容で最後になります。
今まではElastic IPアドレスを使ってブラウザに入力していましたが、ドメインを取得してよりわかりやすいURLに変えていきます。

`ドメイン`は有料ですが，こだわらなければ初年度は数百円程度で取得できます。
この記事では**「お名前.com」**というサービスを利用してドメインを取得します。

# 用意するもの

* **クレジットカード**
* **AWSのアカウント**
* **AWSでデプロイ済みのEC２インスタンス**

# 目次

|目次|内容|
|:--:|:--:|
|セクション1|[EC2インスタンス作成](https://qiita.com/anago1030/items/854252bc9b728fe90beb)|
|セクション2|[Linuxサーバー構築](https://qiita.com/anago1030/items/07f7026c0f4c42a63440)|
|セクション3|[データベース設定](https://qiita.com/anago1030/items/79eebdc8474255b962b4)|
|セクション4|[EC2上でGemをインストールし環境変数を設定](https://qiita.com/anago1030/items/0a9a8937421f64f46a44)|
|セクション5|[Railsアプリを起動](https://qiita.com/anago1030/items/36d0da7e25c57d0e5780)|
|セクション6|[Nginxの導入](https://qiita.com/anago1030/items/c4c80a46a75ff306db8d)|
|セクション7|[自動デプロイ](https://qiita.com/anago1030/items/cb60c8e99d408dc4fd80)|
|セクション8|**独自ドメイン取得**(今回の内容)|

## 1. ドメインを購入
①お名前.com (https://www.onamae.com/） にアクセスします。

②取得したいドメインを検索バーで検索します。

* 注意
    * 先に誰かが使用しているドメインは取得できません。
    * ドメインに使用できる文字は`「半角英数字」`と`「ハイフン -」`です
    * また"_"や"!"といった特殊な記号は使用できないことがあります。
![スクリーンショット 2021-02-27 19.11.19.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/772095/eb7ae613-a366-5799-6090-adf5513ab8ae.png)

③希望のドメインを選択。
こだわりがなければ初年度の安いドメインを取得をおすすめします。
僕自身は`.work`というドメインを選択し最安値の1円に押さえました。

* 購入処理の際の注意
    * **「サーバー」は「利用しない」をチェック**
    * **「Whois情報公開代行メール転送オプション」などは全てチェック不要**
![スクリーンショット 2021-02-27 19.16.43.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/772095/43e20e74-5b25-fc74-8f7b-65b615f31a6d.png)
④その後、会員登録を済ませドメインを購入。
会員登録した際に入力したメールアドレスに以下のメールが来たら、取得可能です。
![スクリーンショット 2021-02-27 19.24.12.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/772095/0eaa0051-6b06-31fe-c1ca-21c937ee4436.png)

## 2. IPアドレスとドメインの関連付け
①サービスでRoute53を選択
先ほど購入したドメインをIPアドレスに変換することができます。

②一番左のDNS managementを選択。
![スクリーンショット 2021-02-27 19.27.02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/772095/df4ed079-1283-000e-ca00-9a284e78907e.png)

③ホストゾーンの作成。

|キー|値|
|:--:|:--:|
|ドメイン名|取得したドメイン名|
|説明-オプション|アプリ名_domein|
|Type|Public Hostes Zone|
![スクリーンショット 2021-02-27 19.31.20.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/772095/d238a4dc-b010-3fc9-c43a-1fe09c027bc5.png)
上記を入力したらホストゾーン作成をクリック

ホストゾーンが作成されると「値/トラフィックのルーティング先」というものが作成されます。
このうちタイプがNSで表示されている4つをネームサーバーとしてメモしておきましょう。
**メモする際に，それぞれの最後についている「ドット .」は削除して下さい！**
![スクリーンショット 2021-02-27 19.35.00.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/772095/811345be-3718-6a2e-7b86-889e1e358d2e.png)

④レコードセットの作成。
Route53の画面から、「レコードを作成」をクリック

|キー|値|
|:--:|:--:|
|レコード名|入力しない|
|値/トラフィックのルーティング先|「レコードタイプに応じた IP アドレス または別の値」をクリックし， Elastic IP を入力|
|レコードタイプ|A|

![スクリーンショット 2021-02-27 19.45.12.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/772095/710bd881-d8b7-c064-c74b-c1a0c3e3e6d9.png)
Aタイプのレコードが作成されたら完了です！


## 3. ネームサーバーの設定
①お名前.comに戻ってログインします。

②ログインしたらドメインの設定から`ネームサーバーの変更`を選択してください。

![スクリーンショット 2021-02-27 19.36.54.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/772095/1769f0a2-64ac-bb45-80b5-eb697c7bc707.png)
③他のネームサーバーを利用を選択。
ネームサーバー情報を入力する欄に先ほどAWSで取得した**NSタイプのレコード（４つ）**を入力。
デフォルトでは２つしか枠がないので、追加入力を２回クリックして枠を追加します。
![スクリーンショット 2021-02-27 19.38.27.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/772095/550e0b7b-2432-092a-79a0-d0c173692ae2.png)

### ネームサーバーの確認
ローカル環境のターミナルから以下のコマンドを実行して下さい。
登録した4つのドメインが入っていればOKです。（順番が入れ替わっていてもOK）

```php:ターミナル
$ dig ドメイン名 NS +short
```

また、ターミナルでdig xxxxx.xxx(←自分のドメイン名)と入力してみましょう。
AWSで取得したレコードが表示されていれば成功です！

```php:ターミナル
$dig xxxxxxx.com

; <<>> DiG 9.10.6 <<>> xxxxxxx.com
;; global options: +cmd
;; Got answer:
;; ->>HEADER<<- opcode: QUERY, status: NOERROR, id: 31076
;; flags: qr rd ra; QUERY: 1, ANSWER: 1, AUTHORITY: 0, ADDITIONAL: 1

;; OPT PSEUDOSECTION:
; EDNS: version: 0, flags:; udp: 4096
;; QUESTION SECTION:
;xxxxxx.com.            IN  A

;; ANSWER SECTION:
xxxxxxx.com.        278 IN  A   xx.xxx.xx.xxx
```
ここまででドメインの設定は完了です！
ドメインの浸透には5分~30分ほど時間がかかる場合があるので、しばらくしたらブラウザにIPアドレスではなくドメイン名を入力して確認してみましょう。

## 4. Nginxの設定
本番環境にNginxを採用している場合は設定を変更しないとエラーがおきてしまいます。
`nginx.confのserver_name`を変更しましょう。

```php:/etc/nginx/conf.d/rails.conf
upstream app_server {
  # Unicornと連携させるための設定。
  server unix:/var/www/xxxxxx/shared/tmp/sockets/unicorn.sock;
}

# サーバの設定
server {
  # このプログラムが接続を受け付けるポート番号
  listen 80;
  # Elastic IPアドレスを独自ドメインに変更
  server_name xxxx.com;

# 接続が来た際のrootディレクトリ
  root /var/www/xxxxxx/current/public;

# assetsファイル(CSSやJavaScriptのファイルなど)にアクセスが来た際に適用される設定
  location ^~ /assets/ {
    gzip_static on;
    expires max;
    add_header Cache-Control public;
    root   /var/www/xxxxxx/current/public;
  }

  try_files $uri/index.html $uri @unicorn;

  location @unicorn {
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header Host $http_host;
    proxy_redirect off;
    proxy_pass http://app_server;
  }

  error_page 500 502 503 504 /500.html;
```
以上で終了です！
ブラウザで確認してみましょう。