Tuesday, 9 August 2011

woff 404 Font Not Found

I noticed recently that a site I work on that uses a woff font was getting a 404 not found error in Chrome. It was also giving a Resource interpreted as Font but transferred with MIME type application/octet-stream. I spent ages hunting around the forums and found no solution to it.


The fact that I was getting a 404 was the oddest thing and made me think that IIS wasn't serving the font correctly (it was being used by the browser none the less). So I went about checking to see what .woff MIME type was set in IIS. The local computer had no MIME Type handling for .woff so I added it (Right-click > Properties > MIME Types... Extension: .woff and Type: application/x-font-woff). That didn't fix it :(

I right-clicked the Default Web Site > Properties > HTTP Headers > MIME Types... and added the new extension there also (Extension: .woff and Type: application/x-font-woff). Reloaded the page and the warning and error had gone - happy days!

Update...
Thanks to the comment below added by RyanonRails, here is an example web.config (http://pastie.org/4081017):
<system.webServer>
    <httpErrors errorMode="Detailed" />
    <staticContent>
      <mimeMap fileExtension=".coffee" mimeType="coffeescript" />
      <mimeMap fileExtension=".woff" mimeType="application/x-font-woff" />
    </staticContent>
  </system.webServer>
</configuration>

5 comments:

  1. I didn't think to add the MIME to the HTTP Headers... that fixed it! Thanks!! :)

    ReplyDelete
  2. Thanks for the quick tip! Really helps move people along.

    Here's my web.config for anyone who might need it in the future: http://pastie.org/4081017 (I tried posting it in the blog but all of the XML tags got destroyed by the blog engine).

    ReplyDelete
    Replies
    1. Thanks :) I have added your config to the post. Pleased it helped.

      Delete