0

Firefox does not allow cross domain fonts it seems. In order to serve fonts from a domain other than the web page, the font files need to be served with a Access-Control-Allow-Origin header. I am currently acheiving this via NGINX like this.

location ~* .(ttf|woff|eot|otf)$ { add_header Access-Control-Allow-Origin *; expires 8d; }

This is working perfectly, however I was wanting to know what the proper value(s) for the header would be, if I did not want to use *. Would be the subdomain I'm using for the CDN? The domain for the site? How would I specify multiple values?

Improve this question

1 Answer 1

Reset to default
1

It needs to be the doamin(s) from where you are requesting the resources.

Let's say you use the font for domain http://example.com then add Access-Control-Allow-Origin: http://example.com. You can space-separate multiple origins.

In some browsers multiple domains cause issues. In that case you can programmatically read the Origin header of the response, check it against some whitelist and respond with the same value in Access-Control-Allow-Origin header. IMO, the latter would be the best practice.

Additional Note

The value of the Access-Control-Allow-Origin header need to consist of scheme (e.g. http), domain (e.g. example.com) and port (only if it is not a default port).

W3C Spec

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

2 Comments

The latter would be hard to implement, since once it goes out to the CDN, the CDN will only serve the file with the headers it received. It won't check the origin server on each request.
Can you confirm that those full URLs need to be there? With the http and not just the FQDN?

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.