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

Question

I keep getting this warning

Resource interpreted as Font but transferred with MIME type application/octet-stream: \"http://127.0.0.1:8080/assets/font/fontawesome-webfont

Answer 1

If you're using a Rack-based app, you can amend the Rack::Mime::MIME_TYPES hash in your config.ru:

# Additional mime types
Rack::Mime::MIME_TYPES.merge!({
  ".eot" => "application/vnd.ms-fontobject",
  ".ttf" => "font/ttf",
  ".otf" => "font/otf",
  ".woff" => "application/x-font-woff"
})

Answer 2

For my IIS instance, i had to use the following:

.woff — application/font-woff (not application/x-font-woff)

See:

• Resource interpreted as Font but transferred with MIME type application/x-font-woff
• http://zduck.com/2013/google-chrome-and-woff-font-mime-type-warnings/

Answer 3

Actually, I found the answer:

Some browsers, like Google Chrome, will show this warning when a font is downloaded from a web server that sets an unexpected MIME type for fonts.

For many font types, there is a solution!

Update the configuration for your web server with the following MIME type per font file extension:

.ttf — font/truetype 
.otf — font/opentype 
.eot — application/vnd.ms-fontobject 
.woff — application/x-font-woff 

If you are using Apache configuration, you may include the AddType directive for each font type:

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

With a specific MIME type configured per font, and not the generic application/octet-stream MIME type, you should no longer see a warning in your web browser console.

This configuration — while effective for cleaning up your console — does not include the technically correct MIME type for fonts like OTF, TTF, and WOFF. For these font types, an official MIME type has not (yet) been approved. An official type for WOFF — application/font-woff — has been requested.AddType font/opentype otf

http://www.jbarker.com/blog/2011/resource-interpreted-font-transferred-mime-type