Heroku Image URL change - ruby-on-rails

I'm developping a Rails4 application with heroku hosting, and i encounter a bit of a problem:
I have a helper method to randomly pick an image by its path in /assets/images/path_to_image and this helper method is called in my HAML file. It works perfectly in my local environment. The images urls are stored in the DB. The problem is that Heroku changes the image names from logo.jpg to logo-a6d14b20c77aa6466e616313edcd3d34.jpg which makes my helper method useless. Any idea on how i could solve this problem? Is it a matter of pre-compiling the assets ?
Thanks a lot
B.

In rails4 by default assets gets the digest URL with them and getting served.
If you want you can use some middleware to redirect assets from non digest path to digest path.
or you can turn off the digest in production.rb file all together like below.
config.assets.digest = false
If you want that redirect solution I can post here as well.
Let me know!

Is it a matter of pre-compiling the assets?
Yes, I would say so
The problem you've got is that production environments compile all your assets, and consequently give you the hashed file-name you're seeing. The reason why this is a problem is that if you're referencing a static file (logo.png) in CSS or HTML, the compiled path will be different, causing the problem to occur. We learnt if you're going to reference any assets, always use a dynamic file (.scss / .haml / .html.erb) and then use the provided helpers
The way around this is to use the asset path helpers, which are basically like this:
image_path
asset_path
Heroku
It seems you're well versed with Rails so I don't bore you with the details
Heroku works best by serving static assets & pre-compiling them before you deploy:
#config/production.rb
config.serve_static_assets = true
You then need to pre-compile the assets with the production environment, like this:
> rake assets:precompile RAILS_ENV=production
This goes through your assets & assigns all the correct paths, if you've used the asset path helpers as mentioned above. After that, push to heroku & I always pre-compile the assets when on Heroku too (we use the asset_sync gem):
> heroku run rake assets:precompile --app [app_name]

Related

Rails 4 Heroku Assets not loading, though in heroku asset pipeline

I have a problem with certain assets on heroku. (local environment is working fine)
The assets are in the pipeline. If I execute in the heroku rails console:
helper.asset_path("typicons.woff")
helper.asset_path("backgrounds/1.jpg")
I get the following response:
/assets/typicons-c2430aad2b6a33948dc064cfaee8ad65ff9e3ca439834f3aaa84abec3d10dea8.woff
/assets/backgrounds/1-c2098ff7e7fbb89b2d18e9cd9089f712f2b837265d1d2e4182c36c23392760c6.jpg
So I assume that the assets are in the heroku asset pipeline. As well by opening the url directly with the digest in it, I receive the file.
However if I try to reference the files in css or javascript like this:
$('.top-content').backstretch("/assets/backgrounds/1.jpg");
The file does not load. As well opening /assets/backgrounds/1.jpg directly does not work. Referencing assets from .rb or .erb files works.
Please can someone tell me, what kind of config I have to change, so the URLs for assets work as well without the digest?
Thank you!
Assuming you are using a fairly standard asset pipeline setup, this passage from the Rails Guides should help:
If you add an erb extension to a JavaScript asset, making it something such as application.js.erb, you can then use the asset_path helper in your JavaScript code:
-- http://guides.rubyonrails.org/asset_pipeline.html (section 2.3.3)
In your example, add the erb extension to your JS file and then change the line to
$('.top-content').backstretch(<%= asset_path("backgrounds/1.jpg") %>);
The problem is that Rails 4 does not support non-digested assets at all.(For whatever reason)
Here is a more thorough explanation on the issue: Non Digested Asset Names in Rails 4
My personal workaround was to add a public asset folder to my app:
public/assets/static/
and upload the assets required there. Since it was only about fonts and background images, which do not change often, it does not seem to be a problem. In the link above there are several other solutions proposed.

Heroku does not display images and also is not accepting my authentication User/Pass for access..How can I access my images?

I have deployed my exhisting project to Heroku. My main pages display some images, which have not loaded on heroku ..... And my backend end authentication pages , accessible only by me, will not accept my user/pass.
images are stored in
app/assets/images
Several points for you
Images
Heroku runs an ephemeral file system, which essentially means your files are overwritten each time you push a new deploy.
This doesn't matter for asset based images, but if you're using the likes of Paperclip to store dynamically-uploaded images, you need to ensure you're able to persist the data (with the likes of S3)
--
Precompilation
In your case, the problem will likely be to do with the precompilation process:
In the production environment Sprockets uses the fingerprinting scheme
outlined above. By default Rails assumes assets have been precompiled
and will be served as static assets by your web server.
Precompilation of the assets is when the Rails application will serve assets from the /public directory, rather than the /assets dir. This is super important as it means if you're referencing assets using "static" CSS references, it simply won't work, especially on Heroku
The best solution for this is to use one of the Rails preprocessors (SCSS / SASS) & use one of the asset path helpers to reference the dynamic asset location:
#app/assets/stylesheets/application.css.scss
body {
background: asset_url("your_image.png");
}
--
Authentication
Your authentication is probably a problem with your database
A problem with Heroku is that as it uses a different database than your local system, you'll have to populate it with the data required to get it working.
It's a common issue to not be able to load the database correctly, missing out many different migrations. I would recommend the following:
$ heroku run rake db:migrate
After this, you need to ensure that you're able to create the relevant details in your application

Rails: Precompile for Heroku?

Before deploying a new version of my app on Heroku, I need to do this in my console (for css and js to work on Heroku): RAILS_ENV=production bundle exec rake assets:precompile.
I just picket this code line from a forum, and I my questions is:
1) Why do I need to do this?
2) Is it possible to implement something more permanent in my Rails code so it does this precompiling automatically (so I don't need to write it manually every time I do some changes in my css or js files)?
1) Why do I need to do this?
There are lot of js files and css file in rails app generally. The above command compress and minified all those files which will reduce the number of requests that browser makes to render a web page. Web browsers are limited in the number of requests that they can make in parallel, so fewer requests can mean faster loading for your application.
More
2) Is it possible to implement something more permanent in my Rails code so it does this precompiling automatically (so I don't need to write it manually every time I do some changes in my css or js files)?
Yes. Heroku automatically compiles your assets if you dont include public/assets/manifest.yml for rails 3 and in rails 4 it is public/assets/manifest-<md5 hash>.json
More
Related Answer : Automatically precompile assets before pushing to Heroku
In your production.rb
config.assets.compile = true

Use assets from gem in production mode

I am trying to figure out how to get boostrap-sass working in production mode. I am using apache to reverse proxy to either webrick or puma, but serve the static assets in public/assets directly. When I precompile assets, the bootstrap css gets included into the application-(hash).css and it works correctly.
However the compiled css references an image file (glyphicons-halfling.png) without appending the hash of the file contents. The image file is included in public/assets directory, and it is possible to browse to it by putting the correct filename in the address bar, but the filename in the css does not match it. I have created a simple demo app that demonstrates this problem, code is on my github page
The glyphicon filename is glyphicons-halflings-c806376f05e4ccabe2c5315a8e95667c.png
[EDIT]
Would still like an answer to this question, but i've just renamed the offending files to remove the hash. Since these files are unlikely to change frequently then this should work fine
Think I have it cracked, when you run rake assets:precompile, it seems that you must prefix it with RAILS_ENV=production in order for it to work properly in production mode (I guess that kind of makes sense). If you don't, some of your assets will get precompiled, but the helper methods will not generate the correct paths.
tl:dr, RAILS_ENV=production rake assets:precompile

Page caching trick on Heroku?

I am moving a rails app to Heroku.
Heroku doesn't seem to support page caching.
So I generated cached pages on my development machine and checked them in to Heroku.
For example, /about_us generates public/about_us.html.
But when I call /about_us, public/about_us.html doesn't seem to be called.
Should my trick work?
Thanks.
Sam
In Rails 3, you'll be using the assets pipeline, so your assets--about_us.html--will be precompiled and put into a folder, WITHIN your public folder. Usually, this file will not be located at 'public/about_us.html'.
With your assets now precompiled, they'll be statically available and appended with an id, that will uniquely identify this asset until it is changed. With the unique signature, caching will occur on both Heroku's (last I checked) as well as within browsers.
Basically, the asset pipeline is doing this already for you.

Resources