We've recently added Font Awesome to MDN, which lives in the "media/font-awesome" directory of the 'kuma' repo. It appears as though fonts are not served up with proper CORS headers and thus our icons appear as empty blocks: http://screencast.com/t/dO1Jb8l9 Could we add appropriate CORS headers for this directory? Thank you!

Les found this which may also be relevant: https://github.com/netdna/bootstrap-cdn/issues/27

Bumping to major because each document page looks wonky with the odd box in Firefox. Any ETA ?

i will grab this so it doesn't page on call. :davidwalsh - to confirm what you're looking for - do you want us to try adding the following apache directives per the github issue? <FilesMatch ".(ttf|otf|woff)$"> Header set Access-Control-Allow-Origin "*" </FilesMatch>

Yep, that appears to be what fixed it for them: https://github.com/netdna/bootstrap-cdn/blob/master/.htaccess#L41 Hopefully that does the trick for us.

as requested, i have applied these directives to MDN. it's currently on the CDN origin and should be available on the CDN directly within 30 minutes. $ curl -Ik https://developer-origin.cdn.mozilla.net/media/fonts/League_Gothic-webfont.woff HTTP/1.1 200 OK Server: Apache X-Backend-Server: developer2.webapp.scl3.mozilla.com vary: Origin, Accept-Encoding Cache-Control: max-age=1209600 Content-Type: text/plain; charset=UTF-8 Date: Tue, 11 Jun 2013 17:56:08 GMT Expires: Tue, 25 Jun 2013 17:56:08 GMT Accept-Ranges: bytes Access-Control-Allow-Origin: * ETag: "4c0e25381ccc0" Last-Modified: Fri, 25 May 2012 20:36:43 GMT X-Cache-Info: caching Content-Length: 21176

That works Chris but I think we're missing the font-awesome-specific fonts: curl -Ik https://developer.cdn.mozilla.net/media/font-awesome/font/fontawesome-webfont.eot?v=3.1.0 HTTP/1.1 200 OK Server: Apache X-Backend-Server: developer3.webapp.scl3.mozilla.com Content-Type: application/vnd.ms-fontobject Accept-Ranges: bytes ETag: "4dece1737ba40" Last-Modified: Mon, 10 Jun 2013 15:04:01 GMT Content-Length: 29360 X-Cache-Info: cached Expires: Mon, 17 Jun 2013 18:40:07 GMT Date: Tue, 11 Jun 2013 19:50:56 GMT Connection: keep-alive

(In reply to David Walsh :davidwalsh from comment #6) > That works Chris but I think we're missing the font-awesome-specific fonts: the FileMatch didn't search for .eot files. i have updated the apache directives to reflect this: - <FilesMatch "\.(ttf|otf|woff)$"> + <FilesMatch "\.(eot|ttf|otf|woff)$"> this is now working in the CDN origin, but will take a bit for caches to clear and get out to the CDNs (non origin). $ curl -Ik https://developer-origin.cdn.mozilla.net/media/font-awesome/font/fontawesome-webfont.eot HTTP/1.1 200 OK Server: Apache X-Backend-Server: developer3.webapp.scl3.mozilla.com Cache-Control: max-age=604800 Content-Type: application/vnd.ms-fontobject Date: Tue, 11 Jun 2013 20:03:20 GMT Expires: Tue, 18 Jun 2013 20:03:20 GMT Accept-Ranges: bytes Access-Control-Allow-Origin: * ETag: "4dece1737ba40" Last-Modified: Mon, 10 Jun 2013 15:04:01 GMT X-Cache-Info: caching Content-Length: 29360

These two "live" versions have not yet hit: https://developer.cdn.mozilla.net/media/font-awesome/font/fontawesome-webfont.woff?v=3.1.0 https://developer.cdn.mozilla.net/media/font-awesome/font/fontawesome-webfont.ttf?v=3.1.0 Will check tomorrow.

i changed one thing looking at the FilesMatch directive and the URL you're submitting -- the directive are not expecting the query parameter. making this change appears to have resolved this and the headers are returned correctly (at least in my tests). - <FilesMatch "\.(eot|ttf|otf|woff)$"> + <FilesMatch "\.(eot|ttf|otf|woff).*$"> $ curl -Ik https://developer.cdn.mozilla.net/media/font-awesome/font/fontawesome-webfont.eot\?v\=3.1.0 HTTP/1.1 200 OK Server: Apache X-Backend-Server: developer3.webapp.scl3.mozilla.com Content-Type: application/vnd.ms-fontobject Accept-Ranges: bytes ETag: "4dece1737ba40" Last-Modified: Mon, 10 Jun 2013 15:04:01 GMT Content-Length: 29360 X-Cache-Info: cached Cache-Control: max-age=476308 Expires: Mon, 17 Jun 2013 16:36:44 GMT Date: Wed, 12 Jun 2013 04:18:16 GMT Connection: keep-alive $ curl -I https://developer.cdn.mozilla.net/media/font-awesome/font/fontawesome-webfont.eot HTTP/1.1 200 OK Server: Apache X-Backend-Server: developer1.webapp.scl3.mozilla.com Content-Type: application/vnd.ms-fontobject Accept-Ranges: bytes Access-Control-Allow-Origin: * ETag: "4dece1737ba40" Last-Modified: Mon, 10 Jun 2013 15:04:01 GMT X-Cache-Info: caching Content-Length: 29360 Cache-Control: max-age=580703 Expires: Tue, 18 Jun 2013 21:36:43 GMT Date: Wed, 12 Jun 2013 04:18:20 GMT Connection: keep-alive

I'm seeing the new header on -origin but not prod yet, so hopefully that will resolve soon: curl -Ik https://developer.cdn.mozilla.net/media/font-awesome/font/fontawesome-webfont.eot?v=3.1.0 HTTP/1.1 200 OK Server: Apache X-Backend-Server: developer3.webapp.scl3.mozilla.com Content-Type: application/vnd.ms-fontobject Accept-Ranges: bytes ETag: "4dece1737ba40" Last-Modified: Mon, 10 Jun 2013 15:04:01 GMT Content-Length: 29360 X-Cache-Info: cached Expires: Mon, 17 Jun 2013 18:40:07 GMT Date: Wed, 12 Jun 2013 12:17:40 GMT Connection: keep-alive

Still not up yet; can we force push the update to production? curl -Ik https://developer.cdn.mozilla.net/media/font-awesome/font/fontawesome-webfont.ttf?v=3.1.0 HTTP/1.1 200 OK Server: Apache X-Backend-Server: developer1.webapp.scl3.mozilla.com Content-Type: text/plain; charset=UTF-8 ETag: "4dece1737ba40" Last-Modified: Mon, 10 Jun 2013 15:04:01 GMT X-Cache-Info: cached Cache-Control: max-age=433291 Expires: Mon, 17 Jun 2013 16:18:04 GMT Date: Wed, 12 Jun 2013 15:56:33 GMT Connection: keep-alive

i found something interesting - the regex we were using support query parameters, but not if they contained '.' i have updated it again with the following, which appears to have resolved this particular use case: - <FilesMatch "\.(eot|ttf|otf|woff).*$"> + <FilesMatch "\.(eot|ttf|otf|woff)"> there is no trivial way to completely clear the cache at our CDNs, since we have more than one in play here. i have flushed the cache on our load balancers, to ensure that the next polling cycle of the CDNs will get the latest changes. my tests to origin currently look successful. $ curl -Ik https://developer-origin.cdn.mozilla.net/media/font-awesome/font/fontawesome-webfont.ttf\?v\=3.1.0 HTTP/1.1 200 OK Server: Apache X-Backend-Server: developer1.webapp.scl3.mozilla.com Vary: Accept-Encoding Cache-Control: max-age=604800 Content-Type: text/plain; charset=UTF-8 Date: Wed, 12 Jun 2013 16:16:09 GMT Expires: Wed, 19 Jun 2013 16:16:09 GMT Accept-Ranges: bytes Access-Control-Allow-Origin: * ETag: "4dece1737ba40" Last-Modified: Mon, 10 Jun 2013 15:04:01 GMT Content-Length: 64960 Connection: Keep-Alive X-Cache-Info: cached ... and if i try a "version" that will not be cached by the CDNs, it also looks good: $ curl -I https://developer.cdn.mozilla.net/media/font-awesome/font/fontawesome-webfont.ttf\?v\=3.1.01 HTTP/1.1 200 OK Server: Apache X-Backend-Server: developer1.webapp.scl3.mozilla.com Content-Type: text/plain; charset=UTF-8 Access-Control-Allow-Origin: * ETag: "4dece1737ba40" Last-Modified: Mon, 10 Jun 2013 15:04:01 GMT X-Cache-Info: caching Cache-Control: max-age=604795 Expires: Wed, 19 Jun 2013 16:22:58 GMT Date: Wed, 12 Jun 2013 16:23:03 GMT Connection: keep-alive

Awesome -- just tried it from -origin and that worked, so once I can pull properly off of the live CDN, I'll resolve this ticket.

Unfortunately still not seeing this in production ...

curl -Ik https://developer.cdn.mozilla.net/media/font-awesome/font/fontawesome-webfont.eot\?v\=3.1.0 HTTP/1.1 200 OK Server: Apache X-Backend-Server: developer3.webapp.scl3.mozilla.com Content-Type: application/vnd.ms-fontobject Accept-Ranges: bytes ETag: "4dece1737ba40" Last-Modified: Mon, 10 Jun 2013 15:04:01 GMT Content-Length: 29360 X-Cache-Info: cached Expires: Mon, 17 Jun 2013 18:40:07 GMT Date: Thu, 13 Jun 2013 13:20:22 GMT Connection: keep-alive

(In reply to David Walsh :davidwalsh from comment #15) > Expires: Mon, 17 Jun 2013 18:40:07 GMT the reason you were not seeing it is because of this header. the context was cached until jun 17th. as a result i completed the cache purge from akamai, which completed not too long ago. you should now see the Access-Control-Allow-Origin header. $ curl -I https://developer.cdn.mozilla.net/media/font-awesome/font/fontawesome-webfont.ttf\?v\=3.1.0 HTTP/1.1 200 OK Server: Apache X-Backend-Server: developer3.webapp.scl3.mozilla.com Content-Type: text/plain; charset=UTF-8 Access-Control-Allow-Origin: * ETag: "4dece1737ba40" Last-Modified: Mon, 10 Jun 2013 15:04:01 GMT X-Cache-Info: caching Cache-Control: max-age=604800 Expires: Thu, 20 Jun 2013 17:44:15 GMT Date: Thu, 13 Jun 2013 17:44:15 GMT Connection: keep-alive

Never in doubt Chris, thank you!