I have a CloudFront distribution set up with an Nginx server as the origin (a Media Temple DV server, to be specific). I enabled the Access-Control-Allow-Origin: * header so fonts will work in Firefox. However, Firefox throws a CORS error for fonts loaded from this CloudFront/Nginx distribution.
I created another CloudFront distribution, this time with an Apache server as the origin, and set Access-Control-Allow-Origin: * also. Firefox displays fonts from this origin without issue.
I've set up a demo page here: http://kristengrote.com/cors-test/
When I perform a curl request for the same font file from each distribution, both files return almost exactly the same headers:
Apache Origin Nginx Origin
——————————————————— ———————————————————
HTTP/1.1 200 OK HTTP/1.1 200 OK
Server: Apache Server: nginx
Content-Type: application/font-woff Content-Type: application/font-woff
Content-Length: 25428 Content-Length: 25428
Connection: keep-alive Connection: keep-alive
Date: Wed, 11 Jun 2014 23:23:09 GMT Date: Wed, 11 Jun 2014 23:15:23 GMT
Last-Modified: Tue, 10 Jun 2014 22:15:56 GMT Last-Modified: Tue, 10 Jun 2014 22:56:09 GMT
Accept-Ranges: bytes Accept-Ranges: bytes
Cache-Control: max-age=2592000 Cache-Control: max-age=2592000
Expires: Fri, 11 Jul 2014 23:23:09 GMT Expires: Fri, 11 Jul 2014 23:15:23 GMT
Access-Control-Allow-Origin: * Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: GET, HEAD Access-Control-Allow-Methods: GET, HEAD
Access-Control-Allow-Headers: * Access-Control-Allow-Headers: *
Access-Control-Max-Age: 3000 Access-Control-Max-Age: 3000
X-Cache: Hit from cloudfront X-Cache: Hit from cloudfront
Via: 1.1 210111ffb8239a13be669aa7c59f53bd.cloudfront.net (CloudFront) Via: 1.1 fa0dd57deefe7337151830e7e9660414.cloudfront.net (CloudFront)
X-Amz-Cf-Id: QWucpBoZnS3B8E1mlXR2V5V-SVUoITCeVb64fETuAgNuGuTLnbzAhw== X-Amz-Cf-Id: E2Z3VOIfR5QPcYN1osOgvk0HyBwc3PxrFBBHYdA65ZntXDe-srzgUQ==
Age: 487
X-Accel-Version: 0.01
X-Powered-By: PleskLin
X-Robots-Tag: noindex, nofollow
So the only conclusion I can draw is that something about Nginx is preventing Firefox from recognizing CORS and allowing the fonts via CloudFront.
Any ideas on what the heck is happening here?
