heroku javascriptと一部のbackground-imageが表示されない

Question

herokuで初めてデプロイしてみましたが、jsの部分と背景のイメージが表示されません
原因は何でしょうか？
config.assets.compile = false
の記載はtrueに変更しました。

他にも変更する必要のあるコードがあるのでしょうか。

ファイル名production.rb

Rails.application.configure do
  # Settings specified here will take precedence over those in config/application.rb.

  # Code is not reloaded between requests.
  config.cache_classes = true

  # Eager load code on boot. This eager loads most of Rails and
  # your application in memory, allowing both threaded web servers
  # and those relying on copy on write to perform better.
  # Rake tasks automatically ignore this option for performance.
  config.eager_load = true

  # Full error reports are disabled and caching is turned on.
  config.consider_all_requests_local       = false
  config.action_controller.perform_caching = true

  # Disable serving static files from the `/public` folder by default since
  # Apache or NGINX already handles this.
  config.public_file_server.enabled = ENV['RAILS_SERVE_STATIC_FILES'].present?

  # Compress JavaScripts and CSS.
  config.assets.js_compressor = :uglifier
  # config.assets.css_compressor = :sass

  # Do not fallback to assets pipeline if a precompiled asset is missed.
  config.assets.compile = true

  # `config.assets.precompile` and `config.assets.version` have moved to config/initializers/assets.rb

  # Enable serving of images, stylesheets, and JavaScripts from an asset server.
  # config.action_controller.asset_host = 'http://assets.example.com'

  # Specifies the header that your server uses for sending files.
  # config.action_dispatch.x_sendfile_header = 'X-Sendfile' # for Apache
  # config.action_dispatch.x_sendfile_header = 'X-Accel-Redirect' # for NGINX

  # Mount Action Cable outside main process or domain
  # config.action_cable.mount_path = nil
  # config.action_cable.url = 'wss://example.com/cable'
  # config.action_cable.allowed_request_origins = [ 'http://example.com', /http://example.*/ ]

  # Force all access to the app over SSL, use Strict-Transport-Security, and use secure cookies.
  # config.force_ssl = true

  # Use the lowest log level to ensure availability of diagnostic information
  # when problems arise.
  config.log_level = :debug

  # Prepend all log lines with the following tags.
  config.log_tags = [ :request_id ]

  # Use a different cache store in production.
  # config.cache_store = :mem_cache_store

  # Use a real queuing backend for Active Job (and separate queues per environment)
  # config.active_job.queue_adapter     = :resque
  # config.active_job.queue_name_prefix = "my-homepage_#{Rails.env}"
  config.action_mailer.perform_caching = false

  # Ignore bad email addresses and do not raise email delivery errors.
  # Set this to true and configure the email server for immediate delivery to raise delivery errors.
  # config.action_mailer.raise_delivery_errors = false

  # Enable locale fallbacks for I18n (makes lookups for any locale fall back to
  # the I18n.default_locale when a translation cannot be found).
  config.i18n.fallbacks = true

  # Send deprecation notices to registered listeners.
  config.active_support.deprecation = :notify

  # Use default logging formatter so that PID and timestamp are not suppressed.
  config.log_formatter = ::Logger::Formatter.new

  # Use a different logger for distributed setups.
  # require 'syslog/logger'
  # config.logger = ActiveSupport::TaggedLogging.new(Syslog::Logger.new 'app-name')

  if ENV["RAILS_LOG_TO_STDOUT"].present?
    logger           = ActiveSupport::Logger.new(STDOUT)
    logger.formatter = config.log_formatter
    config.logger = ActiveSupport::TaggedLogging.new(logger)
  end

  # Do not dump schema after migrations.
  config.active_record.dump_schema_after_migration = false



end

$ heroku logs -t　ターミナル内

2020-01-02T13:57:22.542615+00:00 app[web.1]: [61a10731-f5c9-4b81-a27b-56cb14642415] vendor/bundle/ruby/2.5.0/gems/actionpack-5.0.7.2/lib/action_dispatch/middleware/executor.rb:12:in `call'
2020-01-02T13:57:22.542616+00:00 app[web.1]: [61a10731-f5c9-4b81-a27b-56cb14642415] vendor/bundle/ruby/2.5.0/gems/actionpack-5.0.7.2/lib/action_dispatch/middleware/static.rb:136:in `call'
2020-01-02T13:57:22.542618+00:00 app[web.1]: [61a10731-f5c9-4b81-a27b-56cb14642415] vendor/bundle/ruby/2.5.0/gems/rack-2.0.7/lib/rack/sendfile.rb:111:in `call'
2020-01-02T13:57:22.542619+00:00 app[web.1]: [61a10731-f5c9-4b81-a27b-56cb14642415] vendor/bundle/ruby/2.5.0/gems/railties-5.0.7.2/lib/rails/engine.rb:522:in `call'
2020-01-02T13:57:22.542621+00:00 app[web.1]: [61a10731-f5c9-4b81-a27b-56cb14642415] vendor/bundle/ruby/2.5.0/gems/puma-3.12.1/lib/puma/configuration.rb:227:in `call'
2020-01-02T13:57:22.542622+00:00 app[web.1]: [61a10731-f5c9-4b81-a27b-56cb14642415] vendor/bundle/ruby/2.5.0/gems/puma-3.12.1/lib/puma/server.rb:660:in `handle_request'
2020-01-02T13:57:22.542624+00:00 app[web.1]: [61a10731-f5c9-4b81-a27b-56cb14642415] vendor/bundle/ruby/2.5.0/gems/puma-3.12.1/lib/puma/server.rb:474:in `process_client'
2020-01-02T13:57:22.542625+00:00 app[web.1]: [61a10731-f5c9-4b81-a27b-56cb14642415] vendor/bundle/ruby/2.5.0/gems/puma-3.12.1/lib/puma/server.rb:334:in `block in run'
2020-01-02T13:57:22.542627+00:00 app[web.1]: [61a10731-f5c9-4b81-a27b-56cb14642415] vendor/bundle/ruby/2.5.0/gems/puma-3.12.1/lib/puma/thread_pool.rb:135:in `block in spawn_thread'
2020-01-02T13:57:22.546273+00:00 heroku[router]: at=info method=GET path="/images/china.jpg" host=infinite-tundra-64381.herokuapp.com request_id=61a10731-f5c9-4b81-a27b-56cb14642415 fwd="180.220.136.99" dyno=web.1 connect=1ms service=3ms status=404 bytes=1902 protocol=https
2020-01-02T13:57:22.485503+00:00 heroku[router]: at=info method=GET path="/images/umi.jpg" host=infinite-tundra-64381.herokuapp.com request_id=4022062c-6dae-444e-8f7c-cec89ef294c4 fwd="180.220.136.99" dyno=web.1 connect=0ms service=3ms status=404 bytes=1902 protocol=https
2020-01-02T13:57:23.069447+00:00 heroku[router]: at=info method=GET path="/images/ajax-loader.gif" host=infinite-tundra-64381.herokuapp.com request_id=304a1b14-e0fd-4887-91f3-e9361b003126 fwd="180.220.136.99" dyno=web.1 connect=1ms service=3ms status=404 bytes=1902 protocol=https
2020-01-02T13:57:23.125567+00:00 heroku[router]: at=info method=GET path="/fonts/slick.woff" host=infinite-tundra-64381.herokuapp.com request_id=9c96ff6e-81b7-4899-b77c-7973a10c505e fwd="180.220.136.99" dyno=web.1 connect=0ms service=3ms status=404 bytes=1902 protocol=https
2020-01-02T13:57:23.067422+00:00 app[web.1]: I, [2020-01-02T13:57:23.067320 #4]  INFO -- : [304a1b14-e0fd-4887-91f3-e9361b003126] Started GET "/images/ajax-loader.gif" for 180.220.136.99 at 2020-01-02 13:57:23 +0000
2020-01-02T13:57:23.067979+00:00 app[web.1]: F, [2020-01-02T13:57:23.067899 #4] FATAL -- : [304a1b14-e0fd-4887-91f3-e9361b003126]
2020-01-02T13:57:23.068099+00:00 app[web.1]: F, [2020-01-02T13:57:23.067988 #4] FATAL -- : [304a1b14-e0fd-4887-91f3-e9361b003126] ActionController::RoutingError (No route matches [GET] "/images/ajax-loader.gif"):
2020-01-02T13:57:23.068145+00:00 app[web.1]: F, [2020-01-02T13:57:23.068077 #4] FATAL -- : [304a1b14-e0fd-4887-91f3-e9361b003126]
2020-01-02T13:57:23.068278+00:00 app[web.1]: F, [2020-01-02T13:57:23.068178 #4] FATAL -- : [304a1b14-e0fd-4887-91f3-e9361b003126] vendor/bundle/ruby/2.5.0/gems/actionpack-5.0.7.2/lib/action_dispatch/middleware/debug_exceptions.rb:53:in `call'

Comments

[KazuSaka]

heroku logs -t
で、エラーが出てないか、確認してみると何かわかるかもしれません

[MISIAN-MISIAN]

logみてもエラーが出てないように思います。heroku初めてなのでlogしっかり見れてるかわかりません。

質問の本文にも一部logの内容貼ってみます。時間があればよろしくお願いします。

heroku[router]:〜〜〜method=GETとなってるファイルがうまく表示できてないです。

ローカルで
$rake assets:precompileと$bundle exec rake assets:precompile
両方行なってみましたが
jqueryのプラグインと背景イメージが表示されてない状態です。

Answer 1

production.rb

config.assets.css_compressor = :scss

追加

background-image: image-url("china.jpg");

image-urlに変更

 <img src="<%= asset_path "freemarket.png" %>" alt="制作事例１" width=500px height=280px >

asset_pathの表記追加

で表示されるようになりました

Answer 2

Getリクエストのステータスコードが404(status=404)で返ってきてますね。

2020-01-02T13:57:22.542615+00:00 app[web.1]: [61a10731-f5c9-4b81-a27b-56cb14642415] vendor/bundle/ruby/2.5.0/gems/actionpack-5.0.7.2/lib/action_dispatch/middleware/executor.rb:12:in `call'

のようなエラーもWEBページ表示時のエラーな気もしますが。

** config.assets.compile = true**にした後、
再デプロイしましたか？
(add,commit,push)
heroku run rails dB:migrateも念のため。

Comments

[MISIAN-MISIAN]

再デプロイしてみましたが状態は変わりません。

rails cでRails.application.config.assets.paths
アセットパイプラインの対象になっているか確認しましたが
下記表示通り問題無いようにおもました。

他試したことは、publicディレクトリに入れてた画像を、assets/imagesに移動させました。
しかし状態は変わりません。

```
["/Users/MISIAN/projects/my-homepage/app/assets/config", "/Users/MISIAN/projects/my-homepage/app/assets/images", "/Users/MISIAN/projects/my-homepage/app/assets/javascripts", "/Users/MISIAN/projects/my-homepage/app/assets/stylesheets", "/Users/MISIAN/projects/my-homepage/vendor/assets/javascripts", "/Users/MISIAN/projects/my-homepage/vendor/assets/stylesheets", "/Users/MISIAN/.rbenv/versions/2.5.1/lib/ruby/gems/2.5.0/gems/jquery-rails-4.3.5/vendor/assets/javascripts", "/Users/MISIAN/.rbenv/versions/2.5.1/lib/ruby/gems/2.5.0/gems/coffee-rails-4.2.2/lib/assets/javascripts", "/Users/MISIAN/.rbenv/versions/2.5.1/lib/ruby/gems/2.5.0/gems/actioncable-5.0.7.2/lib/assets/compiled", "/Users/MISIAN/.rbenv/versions/2.5.1/lib/ruby/gems/2.5.0/gems/turbolinks-source-5.2.0/lib/assets/javascripts", "/Users/MISIAN/.rbenv/versions/2.5.1/lib/ruby/gems/2.5.0/gems/font-awesome-sass-5.12.0/assets/stylesheets", "/Users/MISIAN/.rbenv/versions/2.5.1/lib/ruby/gems/2.5.0/gems/font-awesome-sass-5.12.0/assets/fonts"]

```

[KazuSaka]

私も調べてみましたが、申し訳ありませんが、原因の検討がつきません。
以下のリンクはjqueryがherokuで動かない時の事例が載ってます。
試されてない場合、やってみてください。
https://qiita.com/Kohei_Kishimoto0214/items/39ea65f5926c7a538f92

[MISIAN-MISIAN]

同じ記事みてました。
ご丁寧にありがとうございます。
jqueryは動いているのですが
画像が表示されないのが現状です。
scssの記述をimage-urlに変更という記事も試してみましたが
表示できない現状です。

お忙しい中時間とって頂きありがとうございました