11

I am trying to setup Cloudfront for my heroku app. The documentation seems to be lacking to stand independently.

Here are the steps I followed:

 1. Setup Cloudfront in AWS console 2. Added cloudfront domain name to production.rb `config.action_controller.asset_host = 'XXXX.cloudfront.net'` 3. Set `config.assets.compile = true` in production.rb 4. Verified AWS_SECRET_ACCESS_KEY is correct in heroku config 5. I have added `gem 'rails_12factor', group: :production`

None of assets load anymore. Any step I am missing in the setup?

Update1:

In the chrome debugger the asset is correctly requested from cloudfront from this url: http://XXXXX.cloudfront.net/assets/application-22c7c249df1a24541d86603b0715eefe.css

However in the request header see a Status Code:302 Moved Temporarily. I am wondering if I have a redirect loop and how I can debug it.

Update2

Thanks everyone for the suggestions. Some more info:

  1. When I try to download the asset from my app, I get a redirect to home page on browser but using curl I am able to get the asset. ex: curl 'http: //www.myapp.com/assets/application-c9a778bb55ad4152d956fd34fe6f7839.css'
  2. The app doesnt use SSL. However I have still set Origin Protocol Policy to Match Viewer as per @Omar's suggestions
  3. I tried to download the asset from my app on browser and am able to access the assets. ex: 'http: //www.myapp.com/assets/application-c9a778bb55ad4152d956fd34fe6f7839.css' However trying to access the assets directly on cloudfront (d1ax5oefcdtdki.cloudfront.net/assets/application-c9a778bb55ad4152d956fd34fe6f7839.css) redirects it to myapp.com
  4. Screenshots for cloudfront DS:

https://www.dropbox.com/s/bkg480d4it6zl2r/Screenshot%202015-12-06%2014.01.28.png?dl=0

http://glui.me/?i=7ah73hffrhvmpt7/2015-12-06_at_2.02_PM.png/

https://www.dropbox.com/s/dd4wwgm3md8w7qn/Screenshot%202015-12-06%2014.05.20.png?dl=0

Improve this question
10
  • One thing I did was set it up to use protocol relative urls such as //xxx.cloudfront.net. You may need to expire you assets as well by bumping the asset version number in assets.rb if you are using Rails 4. Commented Dec 4, 2015 at 19:53
  • Did you try fetching your assets from S3 directly just to see what happens? Commented Dec 4, 2015 at 22:31
  • @Vidya I am not using S3 for storing assets. Its few images and css, JS in the Rails asset folder currently. Do I need to set something up in S3? Commented Dec 6, 2015 at 1:34
  • Thanks! @CWitty Neither setting '//xxx.cloudfront.net' or bumping up the version number helped Commented Dec 6, 2015 at 2:04
  • Check your web server I wonder if it is the culprit of the redirect. You can also tail the logs of rails and see what it says when you make a request for an asset from cloudfront @codeObserver Commented Dec 6, 2015 at 2:07

2 Answers 2

Reset to default
3

For anyone else having issues debugging cloudfront.

The problem was Cloudfront had cached redirects (prob bec of wrong setup). After invalidating the cache I was able to force CF to fetch assets from my app and serve them.

enter image description here

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

Comments

1
+50

When you request the asset for the first time, cloudfront checks whether the file is cached or not so for example you request:

http://XXXXX.cloudfront.net/assets/application-22c7c249df1a24541d86603b0715eefe.css

for the first time cloudfront will give a cache miss and then it will pull the file from it equivalent path from rails. So that the next time you request the same file, it will be already cached.

In order for this to work you need to make sure that you have everything setup correctly.

From rails side there is nothing much to do except setting the assets_host in production.rb. As you already have the rails_12factor gem there is no need to add the config.assets.compile = true. From the documentation of the gem you can see in the how section that it add serving static assets "the documentation".

From cloudfronts side that is where I think you are facing a problem, you need to set some settings to let cloudfront know how it can communicate with your rails app when the cache misses. In the cloudfront setting you need to check the

Origin Domain Name to be the url of your rails app.

Origin Protocol Policy to Match Viewer

Distribution State to Enabled

Also there are some other settings there that can help you optimize your content delivery caching.

Improve this answer

8 Comments

Thanks! Omar. Everything is already set as you mentioned. Except 'Match Viewer' for Origiin Protocol Policy. However since we dont have SSL enabled yet, it probably doesnt matter. Any other suggestions?
Ok since these settings are not working we need to check whether rails is still serving the static assets to make sure that cloudfront can cache them. So I want you to try to request the asset from your application instead of cloudfront.net use your url
And please try to precompile assets in production env manually
I ran 'herok run rake assets:precompile' . When I try to download the asset from my app, I get a redirect to home page on browser but using curl I am able to get the asset. ex: curl 'http: //www.myapp.com/assets/application-c9a778bb55ad4152d956fd34fe6f7839.css'
i take that back. I am able to access this on browser myapp.com/assets/…
|

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.