Entries from May 2014 ↓

I host Farmstand on Heroku, and I prefer to use Passenger to run it. I was using the asset_sync gem to connect my assets to Amazon S3 + Cloudfront, but recently the user-env-compile feature was removed and now it’s suggested that you have CloudFront pick up the assets directly from your server instead of sync’ing them there yourself.

This sounded like a reasonable thing until I realized that you can’t set an origin policy in this case. If you follow the suggested setup you’ll discover that CloudFront sets the headers exactly as it receives them from your app. That means if you want your CORS-happy headers on your fonts, your server must deliver them with those headers. Some people will point out that you can set default headers in Rails 4, but running curl -I http://0.0.0.0:3000/assets/super-cool-font.ttf was showing none of those headers, and just some information about Nginx. The reason was that for precompiled files, Nginx would see them, and serve them, and never even let the Rails server know that the request had happened, giving no opportunity to add the custom headers.

FireFox was showing me:
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://d1bej2a8uvz4or.cloudfront.net/assets/ss-pika-02874436ebea92b029d8015ec170991f.woff. This can be fixed by moving the resource to the same domain or enabling CORS.

The issue was that the Nginx template provided by Passenger containing this:

location @static_asset {
gzip_static on;
expires max;
add_header Cache-Control public;
add_header ETag "";
}


Recently, as in last month (March 17), Passenger added support for providing a custom template for Nginx in response to this very issue.

Now as long as you ensure your Passenger gem is >= 4.0.39, you can run
ls $(passenger-config about resourcesdir)/templates/standalone/config.erb
to see what the default template is, and make your own version. I put mine in ./config/config.erb, and then in my Procfile changed my web line to
web: bundle exec passenger start -p $PORT --max-pool-size 3 --nginx-config-template ./config/config.erb.

Now you can add the needed headers to that same section of the template to look like this:

location @static_asset {
gzip_static on;
expires max;
add_header Cache-Control public;
add_header ETag "";
add_header Access-Control-Allow-Origin *;
add_header Access-Control-Request-Method *;
}


In my staging.rb/production.rb file, I can use:

config.serve_static_assets = true
config.action_dispatch.x_sendfile_header = 'X-Accel-Redirect'


To get a really close-to-actual test in my local environment, I ran:

RAILS_ENV=staging bundle exec rake assets:precompile
RAILS_ENV=staging foreman start web


and then:

$ curl -I http://0.0.0.0:5000/assets/ss-pika-02874436ebea92b029d8015ec170991f.woff
HTTP/1.1 200 OK
Accept-Ranges: bytes
Access-Control-Allow-Origin: *
Access-Control-Request-Method: *
Cache-Control: max-age=315360000
Cache-Control: public
Content-length: 22404
Content-Type: application/x-font-ttf
Date: Tue, 13 May 2014 15:18:34 GMT
Expires: Thu, 31 Dec 2037 23:55:55 GMT
Last-Modified: Fri, 02 May 2014 20:55:47 GMT
Server: nginx/1.6.0
Connection: keep-alive


Hooray, the headers are there!