7

I've been looking through all of the Rails 4 not serving static images posts, but can't seem to alleviate the problem I'm having.

Take a look at https://fierce-meadow-1536.herokuapp.com

The logo seems to be served, because that was one of the first images I put. A few weeks later, I started the design phase and added more images, but none of them show up.

Case in point the gray header where it says "All Jobs" should actually have a background image under it

What do you think is happening?

Here's what my Deployment to heroku is saying --> 

Fetching repository, done.
Counting objects: 13, done.
Delta compression using up to 4 threads.
Compressing objects: 100% (7/7), done.
Writing objects: 100% (7/7), 609 bytes, done.
Total 7 (delta 6), reused 0 (delta 0)

-----> Removing .DS_Store files
-----> Ruby app detected
-----> Compiling Ruby/Rails
-----> Using Ruby version: ruby-2.0.0
-----> Installing dependencies using Bundler version 1.5.1
       Running: bundle install --without development:test --path vendor/bundle --binstubs vendor/bundle/bin -j4 --deployment
       Using rake (10.1.0)
       Using i18n (0.6.9)
       Using minitest (4.7.5)
       Using multi_json (1.8.2)
       Using atomic (1.1.14)
       Using tzinfo (0.3.38)
       Using builder (3.1.4)
       Using rack (1.5.2)
       Using erubis (2.7.0)
       Using mime-types (1.25.1)
       Using activerecord-deprecated_finders (1.0.3)
       Using polyglot (0.3.3)
       Using arel (4.0.1)
       Using bcrypt-ruby (3.0.1)
       Using will_paginate (3.0.4)
       Using sass (3.2.12)
       Using json (1.8.1)
       Using execjs (2.0.2)
       Using thor (0.18.1)
       Using coffee-script-source (1.6.3)
       Using fssm (0.2.10)
       Using chunky_png (1.2.9)
       Using hike (1.2.3)
       Using tilt (1.4.1)
       Using mini_portile (0.5.2)
       Using pg (0.15.1)
       Using nested_form (0.3.2)
       Using pr_geohash (1.0.0)
       Using bundler (1.5.1)
       Using rails_serve_static_assets (0.0.1)
       Using rubyzip (0.9.9)
       Using rails_stdout_logging (0.0.3)
       Using ruby-ole (1.2.11.7)
       Using temple (0.6.7)
       Using rsolr (1.0.9)
       Using thread_safe (0.1.3)
       Using rack-test (0.6.2)
       Using treetop (1.4.15)
       Using bootstrap-will_paginate (0.0.9)
       Using rdoc (3.12.2)
       Using bootstrap-sass (2.3.2.0)
       Using uglifier (2.3.2)
       Using compass (0.12.2)
       Using coffee-script (2.2.0)
       Using nokogiri (1.6.0)
       Using rails_12factor (0.0.2)
       Using slim (2.0.2)
       Using spreadsheet (0.9.6)
       Using sunspot (2.1.0)
       Using mail (2.5.4)
       Using compass-rails (1.1.2)
       Using sdoc (0.3.20)
       Using roo (1.13.0)
       Using sprockets (2.10.1)
       Using activesupport (4.0.0.rc2)
       Using faker (1.1.2)
       Using actionpack (4.0.0.rc2)
       Using actionmailer (4.0.0.rc2)
       Using sprockets-rails (2.0.1)
       Using railties (4.0.0.rc2)
       Using formtastic (2.2.1)
       Using coffee-rails (4.0.0)
       Using sass-rails (4.0.0)
       Using jquery-rails (3.0.4)
       Using chosen-rails (1.0.2)
       Using activemodel (4.0.0.rc2)
       Using jbuilder (1.5.3)
       Using carrierwave (0.9.0)
       Using activerecord (4.0.0.rc2)
       Using rails (4.0.0.rc2)
       Using sunspot_rails (2.1.0)
       Your bundle is complete!
       Gems in the groups development and test were not installed.
       It was installed into ./vendor/bundle
       Bundle completed (1.34s)
       Cleaning up the bundler cache.
-----> Writing config/database.yml to read from DATABASE_URL
-----> Preparing app for Rails asset pipeline
       Running: rake assets:precompile
       cp public/assets/[email protected] public/assets/[email protected]
       cp public/assets/chosen-sprite-fa9df9bbee9f1ab89799379cb153636e.png public/assets/chosen-sprite.png
       Asset precompilation completed (13.88s)
       Cleaning assets
-----> WARNINGS:
       You have not declared a Ruby version in your Gemfile.
       To set your Ruby version add this line to your Gemfile:
       ruby '2.0.0'
       # See https://devcenter.heroku.com/articles/ruby-versions for more information.
-----> Discovering process types
       Procfile declares types -> (none)
       Default types for Ruby  -> console, rake, web, worker

-----> Compressing... done, 38.9MB
-----> Launching... done, v29
       http://fierce-meadow-1536.herokuapp.com deployed to Heroku

Here's is my gemfile --> 

source 'https://rubygems.org'

# Bundle edge Rails instead: gem 'rails', github: 'rails/rails'
gem 'rails', '4.0.0.rc2'
gem 'bootstrap-sass', '2.3.2.0'
gem 'faker', '1.1.2'
gem 'will_paginate', '3.0.4'
gem 'bootstrap-will_paginate', '0.0.9'

gem 'carrierwave' # for resume upload http://railscasts.com/episodes/253-carrierwave-file-uploads
gem "nested_form" # added to assets pipeline

gem 'roo' # for importing old users http://railscasts.com/episodes/396-importing-csv-and-excel

gem 'sunspot_rails' # one field search -- http://railscasts.com/episodes/278-search-with-sunspot

# for advanced search, try http://railscasts.com/episodes/111-advanced-search-form-revised  // very cool way to filter

gem 'annotate', '2.5.0', group: :development



group :development, :test do
  gem 'sqlite3', '1.3.8'
  gem 'rspec-rails', '2.13.1'
end

group :test do
  gem 'selenium-webdriver', '2.35.1'
  gem 'capybara', '2.1.0'
end
# Use SCSS for stylesheets
gem 'sass-rails', '~> 4.0.0.rc2'

gem 'slim'

# Use Uglifier as compressor for JavaScript assets
gem 'uglifier', '>= 1.3.0'

# Use CoffeeScript for .js.coffee assets and views
gem 'coffee-rails', '~> 4.0.0'

# See https://github.com/sstephenson/execjs#readme for more supported runtimes
# gem 'therubyracer', platforms: :ruby

# Use jquery as the JavaScript library
gem 'jquery-rails'

gem 'chosen-rails' #http://harvesthq.github.io/chosen/ https://github.com/tsechingho/chosen-rails

gem 'formtastic'

# Turbolinks makes following links in your web application faster. Read more: https://github.com/rails/turbolinks
# gem 'turbolinks' Removed turbolinks, because problems loading camera and common app js http://stackoverflow.com/questions/20662426/rails-not-loading-js-in-chome-from-link-to

# Build JSON APIs with ease. Read more: https://github.com/rails/jbuilder
gem 'jbuilder', '~> 1.2'


group :doc do
  # bundle exec rake doc:rails generates the API under doc/api.
  gem 'sdoc', require: false
end

group :production do
  gem 'pg', '0.15.1'
  gem 'rails_12factor', '0.0.2'
  gem 'rails_serve_static_assets'
end

# Use ActiveModel has_secure_password
 gem 'bcrypt-ruby', '~> 3.0.0'

# Use unicorn as the app server
# gem 'unicorn'

# Use Capistrano for deployment
# gem 'capistrano', group: :development

# Use debugger
# gem 'debugger', group: [:development, :test]

This is my Production Config file --> 

Atlas::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 thread 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

  # Enable Rack::Cache to put a simple HTTP cache in front of your application
  # Add `rack-cache` to your Gemfile before enabling this.
  # For large-scale production use, consider using a caching reverse proxy like nginx, varnish or squid.
  # config.action_dispatch.rack_cache = true

  # Disable Rails's static asset server (Apache or nginx will already do this).
  config.serve_static_assets = true

  # 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 = false

  # Generate digests for assets URLs.
  config.assets.digest = true

  # Version of your assets, change this if you want to expire all your assets.
  config.assets.version = '1.0'

  # 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

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

  # Set to :debug to see everything in the log.
  config.log_level = :info

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

  # Use a different logger for distributed setups.
  # config.logger = ActiveSupport::TaggedLogging.new(SyslogLogger.new)

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

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

  # Precompile additional assets.
  # application.js, application.css, and all non-JS/CSS in app/assets folder are already added.
  # config.assets.precompile += %w( search.js )

  # 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

  config.action_mailer.default_url_options = { :host => "fierce-meadow-1536.herokuapp.com" }

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

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

  # Disable automatic flushing of the log to improve performance.
  # config.autoflush_log = false

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

3 Answers 3

Reset to default
18

Run heroku run bash then go to cd public/assets and run an ls. You will see that all the image files now have a hash appended to their name (this is done for cache busting).

You will need to use a scss helper in your scss file, instead of using url(assets/image-file.png) use image-url('image-file.png'), it will resolve the image name properly when it is deployed to production.

For more info checkout: How to reference images in CSS within Rails 4

Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

2

I had *.jpeg files in my app/assets/images directory, and I noticed that Heroku compiled them to have a .jpg extension. Since I was trying to render:

<%= image_tag('my_image.jpeg') %>

the precompiled image couldn't be found. I changed the file extension of the image file to be .jpg and my image tag to:

<%= image_tag('my_image.jpg') %>

and Heroku was able to display the images properly.

Improve this answer

Comments

0

I think it should be noted, at least for others like me who are not yet familiar with some of the configuration conventions with Rails, and since I have yet to find an answer to where within the application.rb file should be placed 'config.serve_static_assets = true', I experimented by making sure that it came after "require 'rails/all'" and it now finally works right for me... For what it's worth...

Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.