Rails: Why images are not showing in my rails basic app

If you are received a file with a .jpeg extension try and renaming the file with just the ".jpg".

From

<%= image_tag "image.jpeg" %>

To:

<%= image_tag "image.jpg" %>

If you are using asset pipeline http://guides.rubyonrails.org/asset_pipeline.html,

The image path should be /assets/product1.jpg instead of /images/product1.jpg

If you are not using asset pipeline, move the images folder to public/images


I just checked your application, there is nothing wrong with your code. The only thing is to understand how image_tag works.

Usually you put all your images, javscripts and stylesheests on the app/assets directory. When you work on the development environment, those files are served uncompressed, but when you deploy to production, the assets are precompiled, minified, and the result files are stored in public/assets.

The idea behind minified assets, is just to make the requests faster for the clients, and to save bandwidth.

Now, on the method image_tag, you can use an external path for the image, a local path for the image or a relative path for the image.

When you do

<%= image_tag "http://www.mywebsite.com/image.jpg" %>

it will use the absolute url for the image tag, and you will end with

<img src="http://www.mywebsite.com/image.jpg" />

You can add a local path as well, like

<%= image_tag "/images/image.jpg" %>

Which will end in

<img src="/images/image.jpg" />

which is actually the issue you are having, because rails, when it precompiles the files, it puts everything within /public/assets, and you can access those files by going to the path /assets as the other users explained.

So the code

<%= image_tag "/assets/image.jpg" %>

actually works, because you end with

<img src="/assets/image.jpg" />

The other thing you can do, is to use a relative path, i.e.

<%= image_tag "image.jpg" %>

that will be converted to

<img src="/assets/image.jpg" />

and that will work the same the last scenario.

Nevertheless, on your application, you are going to let the users to upload their own images, this will happen later when you advance on the book, on a real world app, you will use a gem like paperclip or carrierwave


As Srikanth already said, the assets path should be referenced. As an example you could put <%= image_tag 'rails.png' %> within your code and check firebug (or inspect element within chrome) to check the result.

I'm not quite sure why your code is not working, since I can see you followed Agile Web Development with Rails. I got the depot application running without problems. In your table I see you 'Product1', 'Product2' and 'Product3', is this what you actually filled in within the image_url text_field? What happens if you change 'Product1' to 'product1.jpg'?

On a side note, if you want to use Paperclip, your call should look like this:

<%= image_tag(product.image.url, class: 'list_image') %>