Rails + AWS CloudFront + CORS for AngularJS HTML Templates

Question

I am deploying a Rails 4 application using AngularJS as our MVC front-end environment, and I would like to deploy our resources via CDN. After I ran into problems getting correctly typed URLs when calling asset_pathAngularJS in my javascript file, I decided to exclude AssetSync gem. To replace AssetSync, I would just use Amazon CloudFront on top of my Rails server serving its own static assets. This works fine for my CSS and JS files, but unfortunately I am facing CORS issues when trying to pass my HTML templates for Angular as assets:

Any ideas would be much appreciated!

UPDATE 4/30:

Finally, I was able to get my Rails server to set the correct “Access-Control-Allow-Origin” header for assets using rack-jewel following the instructions in this Github issue . Now, when I start curlto extract files from CloudFront, I see the corresponding headers. However, when I run curlto send a request OPTIONS, I still get a 403 ban. Look at the two screenshots below:

A GET request for an asset looks good:

But the OPTIONS request is not ...

Answer 1

I was asked this solution a couple of times, so I thought I would post what worked for us here.

, Rails CORS CSS JS. , - . config/application.rb:

config.middleware.insert_before 0, "Rack::Cors" do
    allow do
        origins '*'
        resource '/assets/*', :headers => :any, :methods => [:get, :options]
    end
end

CORS , /assets ( ) ​​ config/environments/production.rb:

config.assets.prefix = "/assets"

AWS CloudFront, @Cfstat , AWS CloudFront, . Allowed HTTP Methods, GET OPTIONS.

, , - AWF CloudFront. , config/environments/production.rb:

config.action_controller.asset_host = "//#{ENV['ASSET_HOST']}"

ASSET_HOST env, URL- CloudFront.

Answer 2

OPTIONS .

, .

:

Allowed HTTP Methods
GET, HEAD, PUT, POST, PATCH, DELETE, OPTIONS