Hacker News new | ask | show | jobs
by andrewcooke 5104 days ago
so how do google web fonts work? i just started to use them - all i do is include a

<link href="http://fonts.googleapis.com/css?family=Muli:300,400 rel="stylesheet" type="text/css">

and everything "just works". even in firefox. as far as i know, the fonts are being pulled in from google. all i did was include the above link in my pages, but my site is served from my isp (http://www.acooke.org if you're curious).

that's fonts, in firefox, from a non-origin location. i'm obviously not understanding something (as i said, this is the first time i've used separate fonts). what am i missing? thanks...

1 comments

Loading fonts from another domain requires that domain to explicitly whitelist your use as acceptable, using a CORS (cross-origin resource sharing) policy.

    ~$ GET 'http://fonts.googleapis.com/css?family=Muli:300,400' | grep src:
      src: local('Muli Light'), local('Muli-Light'), url(http://themes.googleusercontent.com/static/fonts/muli/v4/zR-6QGMCFX5j-6nbH_HpIQ.ttf) format('truetype');
      src: local('Muli'), url(http://themes.googleusercontent.com/static/fonts/muli/v4/BfQP1MR3mJNaumtWa4Tizg.ttf) format('truetype');
    ~$ HEAD http://themes.googleusercontent.com/static/fonts/muli/v4/BfQP1MR3mJNaumtWa4Tizg.ttf | grep '^Access-Control'
    Access-Control-Allow-Origin: *
Google uses "Access-Control-Allow-Origin: *", but another site could easily provide customer-specific URLs and use "Access-Control-Allow-Origin: paying-customer.example.com". This restriction on @font-face exists for exactly that reason, which explains why browsers other than Firefox have intentionally not implemented it.

I wonder what it would take to get Mozilla to reconsider that decision? This doesn't seem like a point worth diverging from other browsers on; in this case, the other browsers got it right and Firefox got it wrong.

thanks!