Mime type for WOFF fonts?

Question

What mime type should WOFF fonts be served as?

I am serving truetype (ttf) fonts as font/truetype and opentype (otf) as font/opentype, but I cannot find the correct format for WOFF fonts.

I have tried font/woff, font/webopen, and font/webopentype, but Chrome still complains:

"Resource interpreted as font but transferred with MIME type application/octet-stream."

Anybody know?

Answer 1

As of February 2017, RFC8081 is the proposed standard. It defines a top-level media type for fonts, therefore the standard media type for WOFF and WOFF2 are as follows:

font/woff
font/woff2

Answer 2

Reference for adding font mime types to .NET/IIS

via web.config

<system.webServer>
  <staticContent>
     <!-- remove first in case they are defined in IIS already, which would cause a runtime error -->
     <remove fileExtension=".woff" />
     <remove fileExtension=".woff2" />
     <mimeMap fileExtension=".woff" mimeType="application/font-woff" />
     <mimeMap fileExtension=".woff2" mimeType="application/font-woff2" />
  </staticContent>
</system.webServer>

via IIS Manager

Answer 3

There is no font MIME type! Thus, font/xxx is ALWAYS wrong.

Answer 4

IIS automatically defined .ttf as application/octet-stream which seems to work fine and fontshop recommends .woff to be defined as application/octet-stream

Answer 5

For all Solution index.php remove form url and woff file allowed. for write below code in .htaccess file and and make this alternation to your application/config/config.php file: $config['index_page'] = '';

For only Linux hosting server. .htaccess file details

AddType font/ttf .ttf
AddType font/eot .eot
AddType font/otf .otf
AddType font/woff .woff
<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteBase /

    #Removes access to the system folder by users.
    #Additionally this will allow you to create a System.php controller,
    #previously this would not have been possible.
    #'system' can be replaced if you have renamed your system folder.
    RewriteCond %{REQUEST_URI} ^system.*
    RewriteRule ^(.*)$ /index.php?/$1 [L]

    #When your application folder isn't in the system folder
    #This snippet prevents user access to the application folder
    #Submitted by: Fabdrol
    #Rename 'application' to your applications folder name.
    RewriteCond %{REQUEST_URI} ^application.*
    RewriteRule ^(.*)$ /index.php?/$1 [L]

    #Checks to see if the user is attempting to access a valid file,
    #such as an image or css document, if this isn't true it sends the
    #request to index.php
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteRule ^(.*)$ index.php?/$1 [L]
</IfModule>

<IfModule !mod_rewrite.c>
    # If we don't have mod_rewrite installed, all 404's
    # can be sent to index.php, and everything works as normal.
    # Submitted by: ElliotHaughin

    ErrorDocument 404 /index.php
</IfModule>

Answer 6

NGINX SOLUTION

file

/etc/nginx/mime.types

or

/usr/local/nginx/conf/mime.types

add

font/ttf                      ttf;
font/opentype                 otf;
font/woff                     woff;
font/woff2                    woff2;
application/vnd.ms-fontobject eot;

remove

application/octet-stream        eot;

REFERENCES

RFC @02.2017

https://tools.ietf.org/html/rfc8081#page-15

https://www.iana.org/assignments/media-types/media-types.xhtml

Thanks to Mike Fulcher

http://drawingablank.me/blog/font-mime-types-in-nginx.html