概要

下記記事を参考に、RailsアプリをAWS上で動かす設定をしていたが、unicornの起動後も色々とハマった。
その際の解決方法について。

（参考）unicorn起動までにハマったこと
https://qiita.com/jibirian999/items/f793206a7b7adf485b7d

環境

アプリ
- ruby 3.0.2
- rails 6.1.4
- mysql 8.0.31
EC2AMI
- Amazon Linux2 AMI

エラー①ERR_SSL_PROTOCOL_ERROR

unicorn起動後、ChromeブラウザにてパブリックIPアドレスにアクセスしたところ、エラーが発生。

エラー内容（ブラウザ上で表示）

このサイトは安全に接続できません
XX.XX.XX.XX から無効な応答が送信されました。
ERR_SSL_PROTOCOL_ERROR

https://XX.XX.XX.XX:3000
となっているところを、
http://XX.XX.XX.XX:3000
に変えてアクセスしても同じ。

起動自体はできている様子。

ターミナル（EC2）

[ec2-user@ip-xx-xx-xx-xx <app名>]$ ps -ef | grep unicorn | grep -v grep
ec2-user 22015     1  0 11:32 ?        00:00:01 unicorn_rails master -c config/unicorn.rb -E production -D
ec2-user 22017 22015  0 11:32 ?        00:00:00 unicorn_rails worker[0] -c config/unicorn.rb -E production -D

対応

production.rbのconfig.force_sslがtrueになっていると、常にSSL接続されてしまうとのこと。
httpでアクセスできるように下記をコメントアウト。

config/environments/production.rb

Rails.application.configure do
  # Force all access to the app over SSL, use Strict-Transport-Security, and use secure cookies.
  # config.force_ssl = true # コメントアウト
end

エラー②We're sorry, but something went wrong.

それでも依然アクセスすることができない。

エラー内容

We're sorry, but something went wrong.

curl -v http://XX.XX.XX.XX:3000

curlで試しても同様。

ログを確認

ターミナル（EC2）

[ec2-user@ip-xx-xx-xx-xx <app名>]$ cat log/production.log

(Mysql2::Error: Table 'my-app.users' doesn't exist):

db:createはしていたが、db:migrateはしていなかったことが判明。

対応

ターミナル（EC2）

[ec2-user@ip-xx-xx-xx-xx <app名>]$ rails db:migrate RAILS_ENV=production

正常にマイグレーションが実行された。

エラー③We're sorry, but something went wrong.

それでも依然アクセスすることができない。
再度ログを確認。

ActionView::Template::Error (Webpacker can't find application.js in /var/www/my-app/public/packs/manifest.json. Possible causes:

どうやらアセットコンパイルができていない様子。

対応

ターミナル（EC2）

[ec2-user@ip-xx-xx-xx-xx <app名>]$ rails assets:precompile RAILS_ENV=production

しかしここでもエラーが発生。

Sprockets::FileNotFound: couldn't find file 'trix/dist/trix' with type 'text/css'

そもそもyarnが入っていなかった。

ターミナル（EC2）

[ec2-user@ip-xx-xx-xx-xx <app名>]$ npm install --global yarn

これで再度コンパイル実行し、成功。

参考

エラー④CSSが適用されていない

ここにきて、curlでHTMLを取得できるようになった。
EC2上からも、ローカルからも、どちらもHTML取得できている状態。
また、ブラウザ上でもアクセス自体はできた。
しかし、CSSが効いていない。

ログを見ると、前と同じエラーが出ている。

ActionView::Template::Error (Webpacker can't find application.js in /var/www/my-app/public/packs/manifest.json. Possible causes:

アセットコンパイルがうまくいっていない
or
うまくいっているがコンパイル後のファイルを参照できていない
と思われたため、

キャッシュを削除したり

ターミナル（EC2）

[ec2-user@ip-xx-xx-xx-xx <app名>]$ bundle exec rails tmp:cache:clear
[ec2-user@ip-xx-xx-xx-xx <app名>]$ bundle exec rails assets:clobber RAILS_ENV=production
[ec2-user@ip-xx-xx-xx-xx <app名>]$ bundle exec rails assets:precompile RAILS_ENV=production

webpacker.ymlのproduction設定にて、

compile: false をtrueにしたり
extract_css: true をfalseにしたり

したが、うまくいかず。

対応

参考

こちらの記事と公式ガイドにある通り、

Railsのアセットはプリコンパイル済みかつ静的なアセットとしてWebサーバーから提供されることが前提

のため、config.public_file_server.enabledをtrueにしなければならないとのこと。

config/environments/production.rb

config.public_file_server.enabled = ENV['RAILS_SERVE_STATIC_FILES'].present?

そこで、環境変数として1を渡し、unicornを起動。

ターミナル（EC2）

[ec2-user@ip-xx-xx-xx-xx <app名>]$ RAILS_SERVE_STATIC_FILES=1 unicorn_rails -c config/unicorn.rb -E production -D

これにてCSSが反映され、アプリの正常な起動をすることができた。

最後に

より良い方法や間違い等ありましたらご指摘いただけますと幸いです！