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

# 始めに
前回の内容でブラウザ上でRailsアプリを起動するところまで実装出来ました。
今回は**Nginx**というWebサーバーをインストールしてリクエストとレスポンスをインタラクティブに可能にしていきたいと思います。

# 目次

|目次|内容|
|:--:|:--:|
|セクション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の導入**（今回の内容）|
|セクション7|[自動デプロイ](https://qiita.com/anago1030/items/cb60c8e99d408dc4fd80)|
|セクション8|[独自ドメイン取得](https://qiita.com/anago1030/items/5e487ec48fd7c0be86bc)|

## Nginxの導入
**Nginx(エンジン・エックス)**とは、Webサーバの一種です。
ユーザーのリクエストに対して静的コンテンツの取り出し処理を行い、そして動的コ ンテンツの生成をアプリケーションサーバに依頼するためのものになります。 早速インストールしていきましょう。

### Nginxをインストール

```php:ターミナル（EC2）
# Nginxをインストール
[ec2-user@ip-172-31-25-189 ~]$ sudo amazon-linux-extras install nginx1
```

### Nginxの設定ファイルを編集
次に、Nginxが正しく動くように設定しましょう。 
Nginxの設定は`設定項目X 設定値x;`という形式で入力していきます。
これも先ほどと同様に、vimコマンドを使ってターミナル上で編集していきます。 /etc以下のファイルなので、強い権限でないと書き込み、保存ができません。そのため、コマンドの頭に`sudo`をつけています。

```php:ターミナル(EC2)
[ec2-user@ip-172-31-25-189 ~]$ sudo vim /etc/nginx/conf.d/rails.conf
```
開けたら次のように編集します。

```php:rails.conf
upstream app_server {
  # Unicornと連携させるための設定。
  # アプリケーション名を自身のアプリ名に書き換えることに注意。今回であればおそらく
  server unix:/var/www/〇〇〇〇〇〇<アプリケーション名>/tmp/sockets/unicorn.sock;
}

# {}で囲った部分をブロックと呼ぶ。サーバの設定ができる
server {
  # このプログラムが接続を受け付けるポート番号
  listen 80;
  # 接続を受け付けるリクエストURL ここに書いていないURLではアクセスできない
  server_name XX.XXX.XXX.XX（Elastic IP）;

  # クライアントからアップロードされてくるファイルの容量の上限を2ギガに設定。デフォルトは1メガなので大きめにしておく
  client_max_body_size 2g;

# 接続が来た際のrootディレクトリ
  root /var/www/〇〇〇〇〇<アプリケーション名>/public;

# assetsファイル(CSSやJavaScriptのファイルなど)にアクセスが来た際に適用される設定
  location ^~ /assets/ {
    gzip_static on;
    expires max;
    add_header Cache-Control 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;
}
```

* 3行目の**<アプリケーション名>** となっている箇所は、ご自身のものに変更してください。
* 11行目の**<Elastic IP>**となっている箇所も同様に、ご自身のものに変更してください。
* 14行目の**<アプリケーション名>**となっている箇所は、ご自身のものに変更してくだ さい。

### nginxの権限を変更
POSTメソッドでもエラーが出ないようにするために、下記のコマンドも実行

```php:ターミナル(EC2)
[ec2-user@ip-172-31-25-189 ~]$ cd /var/lib
[ec2-user@ip-172-31-25-189 lib]$ sudo chmod -R 775 nginx
```
これで、Nginxの設定が完了しました。

### Nginxを起動して、設定ファイルを再読み込み

```php;ターミナル(EC2)
[ec2-user@ip-172-31-25-189 lib]$ cd ~
[ec2-user@ip-172-31-25-189 ~]$ sudo systemctl start nginx
[ec2-user@ip-172-31-25-189 ~]$ sudo systemctl  reload nginx

# ステータス確認
[ec2-user@ip-172-31-25-189 ~]$ sudo systemctl  status nginx
● nginx.service - The nginx HTTP and reverse proxy server
   Loaded: loaded (/usr/lib/systemd/system/nginx.service; disabled; vendor preset: disabled)
   Active: active (running) since 日 2021-02-21 04:20:53 UTC; 32s ago
```

## unicorn.rbを修正
次にNginxを介した処理を行うためにunicornの設定を修正します。

```php:unicorn.rb(ローカル)
listen 3000

↓以下のように修正

listen "#{app_path}/tmp/sockets/unicorn.sock"
```
修正をしたら忘れずに、commitとpushをし、サーバ側で以下のコマンドを実行して修正点を反映させておきます。

### ローカルの変更点を本番環境へ反映

```php:ターミナル(EC2)
[ec2-user@ip-172-31-25-189 ~]$ cd /var/www/アプリ名

# 本番環境に反映
[ec2-user@ip-172-31-23-189 <アプリ名>]$ git pull origin master
```

### Unicornを再起動
Unicornのプロセスをkillして、再起動する作業を行います。

```php:ターミナル(EC2)

# プロセスを確認
[ec2-user@ip-172-31-23-189 <リポジトリ名>]$ ps aux | grep unicorn

ec2-user 17877  0.4 18.1 588472 182840 ?       Sl   01:55   0:02 unicorn_rails master -c config/unicorn.rb -E production -D
ec2-user 17881  0.0 17.3 589088 175164 ?       Sl   01:55   0:00 unicorn_rails worker[0] -c config/unicorn.rb -E production -D
ec2-user 17911  0.0  0.2 110532  2180 pts/0    S+   02:05   0:00 grep --color=auto unicorn

# 続いて、unicorn_rails master（一番上）のプロセスをkillします。
[ec2-user@ip-172-31-23-189 <リポジトリ名>]$ kill <確認したunicorn rails masterのPID（上のコードでは17877）>

# unicornを起動します
[ec2-user@ip-172-31-23-189 <アプリ名>]$ RAILS_SERVE_STATIC_FILES=1 unicorn_rails -c config/unicorn.rb -E production -D
```

## ブラウザで確認してみましょう
ブラウザからElastic IPでアクセスすると、アプリケーションにアクセスできます(:3000 をつける必要はありません)。なお、この時もunicornが起動している必要があります。

## ローカルの変更を本番環境に反映させる手順まとめ

* **開発環境でgit push**
* **EC2インスタンスにSSHログイン**

```php:ターミナル(ローカル)

# ssh.ディレクトリで行う
ssh. $ ssh -i ダウンロードしたキーペア名.pem ec2-user@Elastic IPアドレス
```

* ローカルの変更を本番環境に反映

```php:ターミナル(EC2)

# アプリのディレクトリでに移動
[ec2-user@ip-172-31-23-189 <アプリ名>]$　cd /var/www/リポジトリ名

# 本番環境に反映
[ec2-user@ip-172-31-23-189 <アプリ名>]$ git pull origin master
```

* **アセットのコンパイル**

```php:ターミナル(EC2)
[ec2-user@ip-172-31-23-189 <アプリ名>]$ rails assets:precompile RAILS_ENV=production
```

* **Unicorn起動**

```php:ターミナル(EC2)
# プロセスを確認
[ec2-user@ip-172-31-23-189 <リポジトリ名>]$ ps aux | grep unicorn

ec2-user 17877  0.4 18.1 588472 182840 ?       Sl   01:55   0:02 unicorn_rails master -c config/unicorn.rb -E production -D
ec2-user 17881  0.0 17.3 589088 175164 ?       Sl   01:55   0:00 unicorn_rails worker[0] -c config/unicorn.rb -E production -D
ec2-user 17911  0.0  0.2 110532  2180 pts/0    S+   02:05   0:00 grep --color=auto unicorn

# 続いて、unicorn_rails master（一番上）のプロセスをkillします。
[ec2-user@ip-172-31-23-189 <リポジトリ名>]$ kill <確認したunicorn rails masterのPID（上のコードでは17877）>

# unicornを起動します
[ec2-user@ip-172-31-23-189 <アプリ名>]$ RAILS_SERVE_STATIC_FILES=1 unicorn_rails -c config/unicorn.rb -E production -D
```
IPアドレスをうってブラウザで確認



## IPアドレスにアクセスしてもエラーが出る時
エラーが出る時は以下の項目確認してみてください。

* **502 but gateway とエラーが出る場合は、nginxのlogの確認が必要になります。**
*  /var/log/nginx/error.logを**lessまたはcatコマンド**で確認する。 
*  サーバ側で、 /var/www/<レポジトリ名>/log/unicorn.stderr.log を less またはcatコマンドで確認し、エラーが出ていないか確認する(下に行くほど最新のログです。時刻表記がUTCであることに注意してください)
* **Railsを起動しているか**
* **EC2インスタンスの再起動を行ってみる(※本番環境にてmysqlとnginxの起動が必要です。)**

# 終わりに
以上で本番環境でRailsアプリを起動・操作できると思います！
しかし、現状だとローカル環境で変更点が発生した時に本番環境に反映させるのが工数が多く大変です。
なので次回の記事でこのデプロイ作業を自動化するため**Capistrano**というツールを導入したいと思います。
お疲れさまでした。。。

次回
[自動デプロイ](https://qiita.com/anago1030/items/cb60c8e99d408dc4fd80)