IE9阻止跨源Web字体下载

Question

这真让我抓狂。

刚刚在IE9上测试了一个网站，发现“实时”版本正在渲染我使用的Web字体，而小于开发版本。

以下是一些屏幕抓取：

在此处输入图片说明

我正在使用Font Squirrel @ font-face工具包。如您所见，当查看站点的本地版本时，在Firefox，Chrome甚至IE9上都可以。

本地版本和实时版本之间的唯一区别是，该字体是从实时站点上的其他域加载的（我已正确设置了跨域策略，事实证明该字体可在Firefox和Chrome上运行）。

我不记得IE8的样子（微软再次没有想到开发人员，并且已经在IE8之上安装了IE9，没有选择可以同时运行它们）

该站点位于http://enplanner.com，因此您可以查看源。

在这方面的任何帮助将不胜感激-预先感谢您。

编辑：我删除了IE9，发现在本地和IE8中看起来完全一样。看来IE8具有比IE9更接近FF / Chrome的高级渲染引擎。这是一个令人沮丧的发现。

Answer 1

IE9支持.WOFF; IE8不支持，并且仅支持.EOT字体。打开IE9 F12开发人员工具，您会看到以下消息：CSS3117: @font-face failed cross-origin request. Resource access is restricted. Neuton-webfont.woffCSS3117: @font-face failed cross-origin request. Resource access is restricted. YanoneKaffeesatz-Regular-webfont.woffCSS3114: @font-face failed OpenType embedding permission check. Permission must be Installable. Neuton-webfont.ttfCSS3114: @font-face failed OpenType embedding permission check. Permission must be Installable. YanoneKaffeesatz-Regular-webfont.ttf检查您的HTTP标头，很明显您的跨域访问配置不正确，因为Access-Control-Allow-OriginWOFF文件上没有响应标头。它们也以错误的MIME类型（text/plain）交付，尽管这不会引起您的问题。但是，无法映射woff到正确的MIME类型可能会导致问题，因为某些服务器将不提供具有“未定义”扩展名的文件，而是返回HTTP/404错误。

Answer 2

对于IIS，请添加以下行。<system.webServer>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <httpProtocol>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <customHeaders>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <add name="Access-Control-Allow-Origin" value="*" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <add name="Access-Control-Allow-Methods" value="GET,PUT,POST,DELETE,OPTIONS" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <add name="Access-Control-Allow-Headers" value="Content-Type" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </customHeaders>&nbsp; &nbsp; &nbsp; </httpProtocol>&nbsp; </system.webServer>