How are Google web fonts working on Mozilla Firefox while other cross-domain @font-face embedding fail?

Question

I had embedded a Google web font without using the default javascript code provide by Google but by using the @font-face css code present in the dynamic javascript file. It worked fine with Mozilla Firefox.

Now when I try to use a web font downloaded from Font Squirrel, it does not work on Mozilla Firefox. I have used the same @font-face css code as google web font service yet it does not work on Firefox.

I'm aware of the this on Firefox

Firefox (which supports @font-face from v3.5) does not allow cross-domain fonts by default. This means the font must be served up from the same domain (and sub-domain).

if that's the case then, how is Google managing to serve cross-domain web fonts ?

Answer 1

For cross domain fonts to work on Firefox you need to serve them with an Access-Control-Allow-Origin header that allows the domain your app is hosted from

Answer 2

Google can do this because their servers allow the cross-domain sharing. The server that the fonts (and font css) are hosted on controls who it shares with. Make sense?