今回のエラー
制作環境は
- Ruby on Rails
- unicorn
- AWS EC2
- Nginx
Nginxを導入して設定をした後から、本番環境でトップページに表示される予定の画像が表示されない状態になっていた。
ログイン画面のアニメーションとして用意してあった音声ファイルが読みこまれていない。
一部では表示されている画像もあった。
原因
アセットパイプラインの参照先の記述に問題があった。
問題箇所
今回の不具合箇所は2点
- トップページの画像の記述
<%= image_tag("/assets/title_logo.png", class: "header-logo" ) %>
- ログイン画面の音声ファイル
<%= audio_tag("/assets/submit", autoplay: false, controls: true, id:"audio_sub") %>
#対処
行ったことは
- 参照先URLを修正
- git hubに修正をpush
- 本番環境でプリコンパイル、プロセス再起動
1. コードを以下のように変更
- トップページの画像の記述
<%= image_tag "title_logo.png", class: "header-logo" %>
- ログイン画面の音声ファイル
<%= audio_tag "submit", autoplay: false, controls: true, id:"audio_sub" %>
### 変更箇所
変更したのは参照先のURL部分
/assets/
部分を削除した
2. git hubに変更をpush
git hubデスクトップ上でpush
ブランチを切っているなら、masterにmarge
※GUI、ブラウザでの操作だったので詳細割愛
3. 本番環境でプリコンパイル、プロセス再起動
以下ターミナルで操作
-
今回はAWSのEC2でデプロイしているので、EC2のデプロイ済みのインスタンスにログイン
-
git masterをpull
git pull origin master
-
プリコンパイル
rails assets:precompile RAILS_ENV=production
-
nginxを再読み込み
-
sudo systemctl reload nginx
-
sudo systemctl start nginx
-
プロセス再起動
-
プロセス確認
ps aux | grep unicorn
-
プロセス停止
kill (rails masterのプロセス番号)
-
アプリケーションサーバー起動
RAILS_SERVE_STATIC_FILES=1 unicorn_rails -c config/unicorn.rb -E production -D
以上で改善した
#気づいた事
- 開発環境では
image_tag
,audio_tag
を複数使用しており、URLに/assets/
が混同していても問題なかったが、unicorn、nginx(webサーバー)が加わり問題が起きた - コードが改善していても改めてプリコンパイルをしないと表示されなかった
原因の仮説
以下は今回の対処にあたって思ったこと。
調べきれていないので、メモとして書いておく。
- Nginxを利用するとプリコンパイルあたりで違う挙動をする?
- webサーバー(Nginx)は静的な情報を返すもので、動的な情報はアプリケーションサーバーに割り振るような仕組みだと理解しているが、静的な情報としてプリコンパイルをする際に、アセットパイプラインで参照している? そのため、'''/assets/'''と記述してあるとアセットパイプラインとは別に、個別参照になりプリコンパイルがうまくいかなかった?