CSS 谷歌警告：资源被解释为字体但使用 MIME 类型应用程序/八位字节流传输
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/15521130/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Google warning: Resource interpreted as Font but transferred with MIME type application/octet-stream
提问by Bronzato
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".
资源被解释为字体但使用 MIME 类型 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.
请注意，我的服务器是 Microsoft 的 IIS。
Any idea how can I avoid this warning?
知道如何避免此警告吗？
Thanks.
谢谢。
采纳答案by TeYoU
another approach on here: http://zduck.com/2013/google-chrome-and-woff-font-mime-type-warnings/
这里的另一种方法：http: //zduck.com/2013/google-chrome-and-woff-font-mime-type-warnings/
use below settings on your web.config:
在您的 web.config 上使用以下设置：
<system.webServer>
<staticContent>
<mimeMap fileExtension=".woff" mimeType="application/font-woff"/>
</staticContent>
</system.webServer>
回答by 97ldave
You need to add the following types to an .htaccess/IIS:
您需要将以下类型添加到 .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:
更新了 .woff 类型：
AddType application/x-font-woff .woff
(Thanks to @renadeen in comments below for pointing this out.)
（感谢@renadeen 在下面的评论中指出了这一点。）
Check out my answer to a similar question here: Font Face not loaded
在这里查看我对类似问题的回答：Font Face not loaded
Taken from here: font-face problem in chrome.
取自此处：chrome 中的字体问题。
回答by The Senator
Thanks for the above answer @97ldave, you can add these types to your IIS webServer configuration section if you'd rather not add them directly to your MIME types in your IIS setup. The following shows an example of adding just the .woff type that was missing from our configuration. This fixed the issues with the fonts not appearing in the latest version of Safari (6.0.3) on my iMac.
感谢@97ldave 的上述回答，如果您不想将这些类型直接添加到您的 IIS 设置中的 MIME 类型，您可以将这些类型添加到您的 IIS webServer 配置部分。下面显示了一个仅添加配置中缺少的 .woff 类型的示例。这解决了我的 iMac 上最新版本的 Safari (6.0.3) 中未出现字体的问题。
<system.webServer>
<staticContent>
<remove fileExtension=".woff" />
<mimeMap fileExtension=".woff" mimeType="application/x-font-woff" />
</staticContent>
</system.webServer>
Thanks to Jon Samwell (my colleague) for finding this out.
感谢 Jon Samwell（我的同事）发现了这一点。
回答by Steven
For Nginx: (Path: /etc/nginx/mime.types)
对于 Nginx：（路径：/etc/nginx/mime.types）
font/ttf ttf;
font/otf otf;
application/x-font-woff woff;
You dont need application/vnd.ms-fontobject eot;because it exists already.
您不需要，application/vnd.ms-fontobject eot;因为它已经存在。
After that restart Nginx: service nginx restart
之后重启 Nginx： service nginx restart
Done.
完毕。
回答by Sven
Correct MIME types for fonts are:
正确的字体 MIME 类型是：
application/font-ttf ttf;
application/font-otf otf;
application/font-woff woff;
回答by Daan
If you run a server with nodeJS, this is a nice module to map your mime types
如果你使用 nodeJS 运行服务器，这是一个很好的模块来映射你的 mime 类型
https://github.com/broofa/node-mime
https://github.com/broofa/node-mime
var mime = require('mime');
mime.lookup('/path/to/file.txt'); // => 'text/plain'
mime.lookup('file.txt'); // => 'text/plain'
mime.lookup('.TXT'); // => 'text/plain'
mime.lookup('htm'); // => 'text/html'
mime.extension('text/html'); // => 'html'
mime.extension('application/octet-stream'); // => 'bin'
回答by mesut
Thanks to @the-senator and @97ldave for their answers
感谢@the-senator 和@97ldave 的回答
for me the error completely disappear just after adding these lines to the web.config
对我来说，将这些行添加到 web.config 后，错误完全消失
<system.webServer>
<staticContent>
<remove fileExtension=".woff" />
<mimeMap fileExtension=".woff" mimeType="application/x-font" />
<remove fileExtension=".woff2" />
<mimeMap fileExtension=".woff2" mimeType="application/x-font" />
</staticContent>
</system.webServer>
