本番環境
Rails5.2.4
nginx
ruby2.5.7
capistrano3
疑問点
Capistranoを使用してデプロイした際にpublic/images/が404になってしまう。
やったこと
ローカルで app/assets/imagesをpublic/imagesに移動
scss
1body { 2 background-image: url("/images/hoge.jpg"); 3} 4
config/deploy.rb
Rails
1lock "~> 3.12.1" 2 3: 4: 5: 6 7set :rbenv_ruby, '2.5.7' 8set :linked_files, %w(config/master.key .env) 9append :linked_dirs, "log", "tmp/pids", "tmp/cache", "tmp/sockets", "public/system" 10 11after 'deploy', 'deploy:link_images' 12namespace :deploy do 13 task :link_images => [:set_rails_env] do 14 on roles(:web) do |host| 15 within "#{release_path}" do 16 execute :ln, '-s', "#{release_path}/public/images/", "#{shared_path}/public/images" 17 end 18 end 19 end 20end
nginx.conf
conf
1upstream puma { 2 server unix:///home/ec2-user/hogeapp/current/tmp/sockets/puma.sock; 3} 4server { 5 listen 80; 6 server_name x.xxx.xx.xxx; 7 root /home/ec2-user/hogeapp/current/public; 8 9 access_log /var/log/nginx/access.log main; 10 error_log /var/log/nginx/error.log; 11 12 sendfile on; 13 tcp_nopush on; 14 tcp_nodelay on; 15 keepalive_timeout 65; 16 types_hash_max_size 2048; 17 client_max_body_size 100M; 18 include /etc/nginx/mime.types; 19 20 location / { 21 proxy_pass http://puma; 22 proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; 23 proxy_set_header Host $http_host; 24 proxy_set_header X-Real-IP $remote_addr; 25 proxy_redirect off; 26 proxy_connect_timeout 30; 27 } 28 29 30 location ^~ /assets/ { 31 gzip_static on; 32 expires max; 33 add_header Cache-Control public; 34 root /home/ec2-user/hogeapp/current/public; 35 }
capistranoでデプロイしてデプロイは成功する。
本番URLへアクセスしてデベロッパーツールでbodyタグのbackground-imageの画像パスを確認すると...
http:xx.xxx.xxx.xx/images/hoge.jpg : 404
と、なっている。
URLに直接http:xx.xxx.xxx.xx/images/hoge.jpgを入力しても404ページに飛ばされる。
なぜ404になるのか、、、
色々いじくりまわしていて気づいたことはassetsから下へのアクセスではエラーにならないこと。
http:xx.xxx.xxx.xx/images/hoge.jpg → エラー
http:xx.xxx.xxx.xx/assets/images/hoge.jpg → 成功
capistranoを使用していなかった場合には表示されていたためによくわからない。
記事やドキュメントを漁っていたら、一度プリコンパイルするとassets以下を参照するといった記事を見かけるも、腑に落ちない。
なぜなら、capistranoを使用していなかったときにはプリコンパイルしてもhttp:xx.xxx.xxx.xx/images/hoge.jpgで画像は表示されていたため。
余談
そもそもpublic/images/に移動せずに
scss
1body { 2 background-image: image-url("hoge.jpg"); 3}
と、すればassets以下にプリコンパイルされた画像を表示できることや、フィンガープリントのことについては理解しています。
ご教授お願いします。
あなたの回答
tips
プレビュー