Amazon Cloudfront是否为后台主页图像或heroku提供服务？ （rails app）

Question

This is what I have inside production.rb (production environment) file.

  #Enable serving of images, stylesheets, and JavaScripts from an asset server
  config.action_controller.asset_host = "xxxxxxxxxxxxx.cloudfront.net"

So it is enabled. However, my background image stopped showing up when it used to work. Is it an error that I need to address on heroku or cloudfront? My background image size is 850kb. Is it caused by the large image size?

In my css.scss file that point to the image, it is:

.big {
    width: 100%;
    height: 450px;
    position: absolute;
    z-index: -999;
    top: 41px;
    left: 0;
    background: url(../img/main.jpg);
}

So this is pointing to the /img folder in my heroku. Does this need to be changed to a file uploaded on Amazon S3? Why did my background image stop appearing? I am currently paying for an extra dyno on heroku if that makes any difference.

Thanks

Answer 1

You need to use the image-url or asset-path helper that Rails gives you so that it writes out absolute image paths in your CSS files that are generated. The assets are served directly from Cloudfront so the browser makes a request straight to cloudfront - none of it goes via Heroku except the stylesheet request.

You can read more about this at https://devcenter.heroku.com/articles/cdn-asset-host-rails31#asset-references-in-css-js

This article also introduces the assetsync gem which is really handy here too.