WOFF字体应该作为什么mime类型?
我正在服务truetype (ttf)字体作为字体/truetype和opentype (otf)作为字体/opentype,但我找不到WOFF字体的正确格式。
我已经尝试了字体/woff,字体/webopen,和字体/webopentype,但Chrome仍然抱怨:
资源解释为字体,但使用MIME类型应用程序/字节流传输。
有人知道吗?
WOFF字体应该作为什么mime类型?
我正在服务truetype (ttf)字体作为字体/truetype和opentype (otf)作为字体/opentype,但我找不到WOFF字体的正确格式。
我已经尝试了字体/woff,字体/webopen,和字体/webopentype,但Chrome仍然抱怨:
资源解释为字体,但使用MIME类型应用程序/字节流传输。
有人知道吗?
当前回答
IIS自动将.ttf定义为应用程序/octet-stream,这似乎工作正常,而fontshop建议将.woff定义为应用程序/octet-stream
其他回答
为我做的事情是将这个添加到我的mime_types中。rb初始化:
Rack::Mime::MIME_TYPES['.woff'] = 'font/woff'
然后清空缓存
rake tmp:cache:clear
在重新启动服务器之前。
来源:https://github.com/sstephenson/sprockets/issues/366 # issuecomment - 9085509
Mime类型可能不是你唯一的问题。如果字体文件托管在S3或其他域上,您可能还会遇到Firefox无法从不同域加载字体的问题。这在Apache上很容易解决,但在Nginx上,我读到你可能需要用base-64编码你的字体文件,并直接嵌入到你的字体css文件中。
我知道这篇文章有点老了,但在花了很多时间试图让字体在我的nginx本地机器上工作,并尝试了大量的解决方案后,我终于得到了一个对我来说很有魅力的解决方案。
location ~* \.(eot|otf|ttf|woff|woff2)$ {
add_header Access-Control-Allow-Origin *;
}
在圆括号内,您可以放置字体的扩展名或您想要加载的文件。例如,我将它用于字体和图像(png,jpg等),所以不要感到困惑,这个解决方案只适用于字体。
只要把它放入你的nginx配置文件,重新启动,我希望它也适用于你!
向.NET/IIS添加字体mime类型的参考
通过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管理器
对我来说,接下来就是在.htaccess文件中工作。
AddType font/ttf .ttf
AddType font/eot .eot
AddType font/otf .otf
AddType font/woff .woff
AddType font/woff2 .woff2