css - Google warning: Resource interpreted as Font but transferred with MIME type application/octet-stream

Question

I have a warning in Google for my font-face:

Resource interpreted as Font but transferred with MIME type application/octet-stream: ".../Content/Fonts/iconFont.ttf".

It works even if I have this warning but I prefer avoid this warning.

Here is my declaration:

@font-face {
  font-family: 'iconFont';
     src: url('../Fonts/iconFont.eot?#iefix') format('embedded-opentype'), 
     url('../Fonts/iconFont.svg#iconFont') format('image/svg+xml'), 
     url('../Fonts/iconFont.woff') format('font/x-woff'), 
     url('../Fonts/iconFont.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

I already search on other posts but no luck so far.

Please note that my server is IIS from Microsoft.

Any idea how can I avoid this warning?

Thanks.

Answer 1

You need to add the following types to an .htaccess/IIS:

AddType application/vnd.ms-fontobject .eot
AddType font/ttf .ttf
AddType font/otf .otf
AddType application/font-woff .woff  

Updated .woff type from:

AddType application/x-font-woff .woff

(Thanks to @renadeen in comments below for pointing this out.)

Check out my answer to a similar question here: Font Face not loaded

Taken from here: font-face problem in chrome.