I'm using the Font-Awesome-Sass-Rails gem for icon fonts and they display properly in all browsers but Firefox. I'm currently using Cloudfront and Nginx. Here is my CORS configuration:
<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
<AllowedOrigin>*</AllowedOrigin>
<AllowedMethod>GET</AllowedMethod>
<MaxAgeSeconds>3000</MaxAgeSeconds>
<AllowedHeader>*</AllowedHeader>
</CORSRule>
</CORSConfiguration>
Any ideas?
If the answer above does not solve anyone's problem then here is my solution which is working :
# Cross domain webfont access
location ~* \.(?:ttf|ttc|otf|eot|woff|font.css)$ {
add_header "Access-Control-Allow-Origin" "*";
expires 1M;
access_log off;
add_header Cache-Control "public";
}
When I had the same problem I found the only solution which worked for me was setting a header within nginx itself.
location ~* \.(eot|otf|ttf|woff)$ {
add_header Access-Control-Allow-Origin *;
}
examples above did not work, this worked. in nginx config, put if block inside /assets/ rule
location ^~ /assets/ {
gzip_static on;
expires max;
add_header Cache-Control public;
if ($request_filename ~* ^.*?\.(eot)|(ttf)|(woff)|(svg)|(otf)$) {
add_header Access-Control-Allow-Origin *;
}
}