When loading one of my website in Chrome, I noticed the following error message in the JavaScript console:
Resource interpreted as Font but transferred with MIME type font/x-woff: “https://xxx.xxx/xxx.woff”.
Actually it looks like it took too long to define and official MIME type for WOFF fonts and a few different MIME types have been used until the official one was defined:
- font/x-woff
- application/x-font-woff
- application/font-woff – This is actually the official MIME type for WOFF fonts
- font/woff
By default IIS7 will not know what to do with the WOFF font file, so you will get a 404 error when fetching it.
In my case I was using some third party files which defined the following in order to solve the 404 error:
<system.webServer>
<staticContent>
<remove fileExtension=".woff" />
<mimeMap fileExtension=".woff" mimeType="font/x-woff" />
</staticContent>
</system.webServer>
But this MIME type is now not in use anymore. So I tried the following:
<system.webServer>
<staticContent>
<remove fileExtension=".woff" />
<mimeMap fileExtension=".woff" mimeType="application/font-woff" />
</staticContent>
</system.webServer>
And the error in the console was gone. Actually using application/x-font-woff instead of application/font-woff also works. This is probably because for a very long time, Chrome didn’t support the new MIME type and really expected application/x-font-woff.
If you’re using Apache as a Web Server, you will need to add the AddType directive to your .htaccess file:
AddType application/font-woff .woff
Note that you may get any of the following error messages which basically all mean that the mime type provided is not the expected one and you need to update the configuration of your web server:
resource interpreted as font but transferred with mime type font/x-woff resource interpreted as font but transferred with mime type application/octet-stream resource interpreted as font but transferred with mime type application/x-woff resource interpreted as font but transferred with mime type application/x-font-otf resource interpreted as font but transferred with mime type font/woff resource interpreted as font but transferred with mime type font/truetype
If you have a similar problem with other types of files, please refer to the official list of Media Types (formerly called MIME types).