Image src is not working in Rails - ruby-on-rails

My haml file:
%img{:class => 'thumbnail', :src => '/assets/images/filename.jpg'}
It outputs correctly in the html browser:
<img class="thumbnail" src="/assets/images/filename.jpg">
But the image doesn't show up.
This is what Chrome is looking for:
http://127.0.0.1:3000/assets/images/filename.jpg
But when I try to visit that url, I'm being shown:
Routing Error
No route matches [GET] "/assets/images/filename.jpg"
Try running rake routes for more information on available routes.shown
Am I supposed to add something in the config file?? Any help would be much appreciated, thanks.
PS: I am working in development environment, so I serve my own static files.

You should use /assets/filename.jpg without images namespace.

You should be able to do = image_tag('filename.jpg', class: 'thumbnail') in your haml file.
Also, you can check if there's any image before adding the path by just going to the browser and see if anything comes up, like:
http://127.0.0.1:3000/assets/images/filename.jpg
http://127.0.0.1:3000/assets/filename.jpg

I solved my issue. Because I am using Rails 3.2 and this version uses the asset pipeline, you have to declare the directories you want to be public. You do this by adding this line in the config/application.rb file:
config.assets.paths << Rails.root.join("path", "to", "dir", "from", "root")
In my case, I wanted the medias/images/thumbnails dir to be part of the assets (medias is at root level), so I achieved this simply by adding:
config.assets.paths << Rails.root.join("medias", "images", "thumbnails")
I can then access them in the templates like other assets with src="/assets/filename.jpg". This is practical because in my case I just want the thumbnails to be public, not the original pictures.

Related

carrier wave not loading default image url?

When I run rails in production mode , I put the default url of avatar in assets/images and made it like this :
"/assets/" + [version_name, "image.jpeg"].compact.join('_')
it works perfevtly in development mode but in production it doesn't and I don't know why also I have pre compiled assets but still so hope you help .
If the path of your asset is:
/assets/v1_image.png
Then it will perfectly work fine in development if you used something like:
<img src="/assets/v1_image.png" />
Because in development assets are not precompiled by Rails asset pipeline.
But in production the asset pipeline will compile your assets and stamp it with some md5hash so your file name will end-up to be like:
/assets/v1_image-aee4be71f1288037ae78b997df388332edfd246471b533dcedaa8f9fe156442b.png
So the correct way to use it should be something like:
<img src="/assets/v1_image-aee4be71f1288037ae78b997df388332edfd246471b533dcedaa8f9fe156442b.png" />
but still this md5 hash will change from a deployment to another so the rails way to handle this is to use image_path, image_url or image_tag helpers from ActionView::Helpers::AssetUrlHelper to generate the correct path for you as follows:
image_tag('v1_image.png') will return:
<img src="/assets/v1_image-aee4be71f1288037ae78b997df388332edfd246471b533dcedaa8f9fe156442b.png" />
image_path('v1_image.png') will return:
/assets/v1_image-aee4be71f1288037ae78b997df388332edfd246471b533dcedaa8f9fe156442b.png
image_url('v1_image.png') will return:
http://www.example.com/assets/v1_image-aee4be71f1288037ae78b997df388332edfd246471b533dcedaa8f9fe156442b.png
I hope this is clear enough and can fix your problem :)
The problem could be due to /assets interfering with rails asset pipeline.
Please post your code for a better understanding of the question

Rendering images from root with image_tag

I have a folder in my root 'root/tmp/database/*.JPG' that I want to show in my view with a image_tag.
My current code for this is:
<% #images.each do |image| %>
<%= image_tag image.file, class: "img-responsive" %>
<% end %>
But because image_tag uses the asset pipeline it renders the images as:
'/images/tmp/database/xotter-1.jpg'
So my question is, is it possible that I use an image_tag and get the images rendered as: '/tmp/database/*.JPG'
All assets (images, css, js etc) served in your website need to come from somewhere inside the public folder. However, the public folder can contain symbolic links, aka shortcuts, to other folders.
So, for example, if you want to serve files from #{Rails.root}/tmp/database you can make a symbolic link like so:
#from your application folder
cd public
ln -s ../tmp/database database
You should now have the appearance of having the database folder inside your public folder, and can link to a file in it with the url
"/database/xotter-1.jpg"
which corresponds to a file at
#{Rails.root}/public/database/xotter-1.jpg
These instructions assume you are in a bash-style command line shell, eg in linux or mac os. If you are in windows you may need to set the shortcut up differently.
EDIT: an answer to your follow up question about displaying all images in a folder.
Let's say you have a folder #{Rails.root}/public/database and you want to find all jpg files in it: you can do that in a variety of ways. I like Dir[], used with File.join (which is a safe way to generate file paths which accounts for extra/missing slashes, which are otherwise easy to get wrong by mistake) eg
jpg_files = Dir[File.join("public/database", "*.jpg")]
=> ["public/database/foo.jpg", "public/database/bar.jpg"]
Note that these paths are all relative to where the command is run from, which in the case of a rails server or console is the rails application folder.
If you want to link to these, you will need the path relative to the public folder, which you can get by saying
filename.gsub("public","")
=> "/database/foo.jpg"
So, to tie this together, in your template:
<% Dir[File.join("public/database", "*.jpg")).each do |file| %>
<%= image_tag file.gsub("public",""), class: "img-responsive" %>
<% end %>
Just to add to Max Williams' epic answer, if you populate your public folder with your images (instead of tmp), you'll be able to use the built-in asset_path helpers:
Computes the path to asset in public directory
asset_path "database/xotter-1.jpg" #-> /public/assets/database/xotter-1.jpg"
I appreciate this means you have to use the assets subdirectory, but there is a good reason for this...
--
Precompilation
Personally, I would put the images into the assets/images folder of your app.
The problem you'll have is that all of your images will remain "naked" in your public folder, which will both leave them open to hotlinking, but also prevent their proper use in the asset pipeline.
If you include the images in assets/images/...., you get to precompile the images when you push to production:
rake assets:precompile RAILS_ENV=production
Precompilation puts all the assets into the /public folder anyway... but more importantly, fingerprints them:
public/assets/images/database/xotter-1-[[fingerprint]].jpg
These images will still be available if you call image_tag databsae/xotter-1.jpg, but this time they'll be in their correct place.
All paths in Rails are taken from the public dir, so you can reference a link to the public dir directly, by using a relative path:
image_tag 'database/xotter-1.jpg
The difference is that if you put your images into assets/images, they are included in the asset pipeline, and thus will be accessible regardless of the environment you're running your app in.

How should I access the asset_url helper in the view

When I try to use asset_url in my view (Rails 3.2), I get a NoMethodError.
What do have to do to be able to use AssetUrlHelper's methods in my views?
To explain this a bit better and maybe find an alternative solutions: I need to get an "asset link" to file attachments created with carrierwave.
My model has an attachment which points to a file in my assets directory. I need to draw a link to this file.
= link_to model.name, model.attachment(:size)
gives me /myfiles/model/id/attachment/size.png (which is what is persisted by carrierwave)
= image_tag model.attachment(:size)
gives me the wanted http://static_host.com/.../size.png
but I have no need for an image tag, but the plain link to the file at the asset host.
The following works ok for me:
<%= link_to "link to asset", asset_path(article.image.url) %>
I'm using paperclip but I doubt it makes much difference
I think the helper asset_path belongs to asset files (like .css and .js) , not views. In views is proper to be used helpers like image_tag or stylesheet_include_tag. This is the idea behind the asset-pipeline - to ease reference to assets.

Using paths in javascript assets in rails 3.1.rc1

I have a file called myjavascript.js.erb in my assets path. This is where I put all my project related javascript etc.
As I understand it, rails runs this file through the erb interpreter first and then loads the resulting JS file.
I have the following line in my file
console.log( "<%= root_path %>" );
I was hoping that this would log the root path of the project but unfortunately it seems to only get me
"/path to rails project omitted/app/assets/javascripts"
Surely this should point to the root of my project? Am I doing something wrong?
You can use
Rails.root
To get to the root path in Rails.

How do I use CSS with a ruby on rails application?

How do I use CSS with RoR? When I link externally, I'm never able to see the files. I cp'd the .css file to every folder I could think of...views, controller, template, and nothing seems to work.
What do I need to do to enable external CSS files with a rails application? I'm new to rails, so forgive me if this is basic.
Put the CSS files in public/stylesheets and then use:
<%= stylesheet_link_tag "filename" %>
to link to the stylesheet in your layouts or erb files in your views.
Similarly you put images in public/images and javascript files in public/javascripts.
If you are using rails > 3 version, then there is a concept called asset pipeline. You could add your CSS to
app/assets/stylesheets
then it will automatically be picked up by the app. (this is useful as rails will automatically compress the CSS files)
read more here about the asset pipeline
Use the rails style sheet tag to link your main.css like this
<%= stylesheet_link_tag "main" %>
Go to
config/initializers/assets.rb
Once inside the assets.rb add the following code snippet just below the Rails.application.config.assets.version = '1.0'
Rails.application.config.assets.version = '1.0'
Rails.application.config.assets.precompile += %w( main.css )
Restart your server.
I did the following...
place your css file in the app/assets/stylesheets folder.
Add the stylesheet link <%= stylesheet_link_tag "filename" %> in your default layouts file (most likely application.html.erb)
I recommend this over using your public folder. You can also reference the stylesheet inline, such as in your index page.
The original post might have been true back in 2009, but now it is actually incorrect now, and no linking is even required for the stylesheet as I see mentioned in some of the other responses. Rails will now do this for you by default.
Place any new sheet .css (or other) in app/assets/stylesheets
Test your server with rails-root/scripts/rails server and you'll see the link is added by rails itself.
You can test this with a path in your browser like testserverpath:3000/assets/filename_to_test.css?body=1
To add to the above, the most obvious place to add stylesheet_link_tag is in your global application layout - application.html.erb.
With Rails 6.0.0, create your "stylesheet.css" stylesheet at app/assets/stylesheets.
Have you tried putting it in your public folder? Whenever I have images or the like that I need to reference externally, I put it all there.

Resources