WOFF字体的Mime类型？

什么mime类型应该作为WOFF字体？

我将truetype（ttf）字体作为font/truetype和opentype（otf）作为font/opentype opentype提供，但我找不到WOFF字体的正确格式。

我尝试过font/woff ， font/webopen和font/webopentype ，但Chrome仍然抱怨：

“资源被解释为字体，但使用MIME类型application / octet-stream进行传输。”

有人知道吗？

#1楼

对我这样做的事情是将它添加到我的mime_types.rb初始化器：

Rack::Mime::MIME_TYPES['.woff'] = 'font/woff'

并清除缓存

rake tmp:cache:clear

在重新启动服务器之前。

资料来源： https ： //github.com/sstephenson/sprockets/issues/366#issuecomment-9085509

#2楼

Mime类型可能不是您唯一的问题。如果字体文件托管在S3或其他域上，您可能还会遇到Firefox不会从不同域加载字体的问题。这是Apache的一个简单修复，但在Nginx中，我已经读过你可能需要在base-64中编码你的字体文件并将它们直接嵌入你的font css文件中。

#3楼

将以下内容添加到.htaccess中

AddType font/woff woff

祝好运

#4楼

NGINX解决方案

文件

/etc/nginx/mime.types

要么

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

加

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

去掉

application/octet-stream        eot;

参考

RFC @ 02.2017

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

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

感谢Mike Fulcher

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

#5楼

将字体mime类型添加到.NET / IIS的参考

通过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="font/woff" /><mimeMap fileExtension=".woff2" mimeType="font/woff2" /></staticContent>
</system.webServer>

通过IIS管理器

#6楼

对于所有解决方案index.php删除表单url和woff文件允许。 写下.htaccess文件中的代码，然后将这个替换为你的application / config / config.php文件：$ config ['index_page'] ='';

仅适用于Linux托管服务器。 .htaccess文件详细信息

AddType font/ttf .ttf
AddType font/eot .eot
AddType font/otf .otf
AddType font/woff .woff
<IfModule mod_rewrite.c>RewriteEngine OnRewriteBase /#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.phpRewriteCond %{REQUEST_FILENAME} !-fRewriteCond %{REQUEST_FILENAME} !-dRewriteRule ^(.*)$ 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: ElliotHaughinErrorDocument 404 /index.php
</IfModule>

#7楼

@Nico ，

目前，没有为woff字体mime类型定义的标准。我使用字体传递cdn服务，它使用font / woff，我在chrome中得到相同的警告。

参考：互联网号码分配机构

#8楼

WOFF：

Web开放字体格式
它可以使用TrueType或PostScript（CFF）轮廓进行编译
它目前由FireFox 3.6+支持

尝试添加：

AddType application/vnd.ms-fontobject .eot
AddType application/octet-stream .otf .ttf

#9楼

IIS自动将.ttf定义为application / octet-stream，它似乎工作正常，而且fontshop建议将.woff定义为application / octet-stream

#10楼

截至2017年2月， RFC8081是建议的标准。它定义了字体的顶级媒体类型，因此WOFF和WOFF2的标准媒体类型如下：

font/woff
font/woff2

#11楼

2017年6月22日Keith Shaw的评论更新：

截至2017年2月， RFC8081是建议的标准。它定义了字体的顶级媒体类型，因此WOFF和WOFF2的标准媒体类型如下：

font/woff

font/woff2

2011年1月，宣布 Chromium将承认

application/x-font-woff

作为WOFF的哑剧型。我知道这个变化现在已经在Chrome测试版中，如果还没有稳定，那么它应该不会太远。

#12楼

我知道这篇文章有点陈旧但是花了很多时间试图让我的nginx本地机器上的字体工作并尝试了大量的解决方案后我终于得到了一个对我有用的东西就像一个魅力。

location ~* \.(eot|otf|ttf|woff|woff2)$ {add_header Access-Control-Allow-Origin *;
}

在括号内，您可以放置字体的扩展名，或者通常是要加载的文件。例如，我将它用于字体和图像（png，jpg等），所以不要混淆这个解决方案只适用于字体。

只需将它放入你的nginx配置文件，重启，我希望它也适合你！

#13楼

https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Complete_list_of_MIME_types

这是一个有用的mimetypes列表

#14楼

它将是application/font-woff 。

见http://www.w3.org/TR/WOFF/#appendix-b(W3C候选人推荐2011年8月4日）

和http://www.w3.org/2002/06/registering-mediatype.html

来自Mozilla css字体笔记

在Gecko中，Web字体受到相同的域限制（字体文件必须与使用它们的页面位于同一域中），除非使用HTTP访问控制来放宽此限制。注意：由于TrueType，OpenType和WOFF字体没有定义的MIME类型，因此不考虑指定文件的MIME类型。

来源： https ： //developer.mozilla.org/en/CSS/@font-face#Notes

#15楼

没有font MIME类型！因此， font/xxx总是错误的。

#16楼

对我来说，下一个是在.htaccess文件中工作。

AddType font/ttf .ttf
AddType font/eot .eot
AddType font/otf .otf
AddType font/woff .woff
AddType font/woff2 .woff2

#17楼

我遇到了同样的问题， font / opentype对我有用

#18楼

也许这会对某人有所帮助。我在IIS 7上看到.ttf已经是一个已知的mime类型。它被配置为：

application/octet-stream

所以我只是添加了所有CSS字体类型（ .oet ， .svg ， .ttf ， .woff ），IIS开始提供它们。 Chrome开发工具也不会抱怨重新解释类型。

干杯，迈克尔