当由IIS提供服务时,Fontawesome不起作用

Question

当我将我的应用程序放在IIS7服务器上时,FontAwesome对我不起作用.

在Firefox中,请求的URL被编码为http://l2etest.kema.intra/fonts/fontawesome-webfont.ttf%3Fv=4.0.3,我得到404.当我%3F改为?一切正常.

在IE中也发生了同样的事情,但请求转到了eot字体.

这就是我在CSS中所拥有的(与FontAwesome页面相同):

@font-face {
  font-family: 'FontAwesome';
  src: url('../fonts/fontawesome-webfont.eot?');
  src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.0.3') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff?v=4.0.3') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.0.3') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.0.3#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

我认为问题是IIS编码URL而不是请求../fonts/fontawesome-webfont.eot?请求../fonts/fontawesome-webfont.eot%3F.

请不要建议删除'？' 或来自网址的"#".他们是有目的的,是必不可少的.问题是如何使IIS不以这种方式编码URL.任何线索将不胜感激.

编辑:顺便说一句.上面的情况发生在web.config中我设置requestValidationMode和requestPathInvalidCharacters:

<httpRuntime shutdownTimeout="360" maxRequestLength="102400" enable="true" requestValidationMode="2.0" requestPathInvalidCharacters="" />

没有它我得到400(错误的请求): 从客户端检测到一个潜在危险的Request.Path值(？)

如何修复IIS以正确提供字体？

编辑2: 好的,我找到了问题的原因.用于MVC3的SquishIt捆绑工具正在改变这些角色.当我从bundle中排除font-awesome.css时,一切正常.

Answer 1

为什么@ font-face在woff文件上抛出404错误？

在Web配置中添加MIME类型:

  <system.webServer>
    <staticContent>
      <remove fileExtension=".woff" /> <!-- In case IIS already has this mime type -->
      <mimeMap fileExtension=".woff" mimeType="application/x-font-woff" />
    </staticContent>    
  </system.webServer>

Answer 2

您可以打开IIS,指向您的网站,在IIS会话中,选择MIME类型.显示Mime Types视图后,单击Add - > In对话框:

• 文件扩展名:.woff
• MiME类型:application/x-font-woff

单击确定.

完成.

Answer 3

这个答案不是针对上述问题，而是针对那些面临类似错误但由于不同原因并进入此线程的人。

我遇到了类似的问题，但后来发现 IIS 试图在文件夹中查找字体很棒的 woff,eot 文件，MyIpAddress/fonts/fontawesome-webfont.woof但我将这些文件放在了不同的文件夹中。移动fontawesome-webfont.eot, fontawesome-webfont.svg,fontawesome-webfont.ttf, fontawesome-webfont.woff到我的字体文件夹解决了我的问题

Answer 4

MVC3 的 SquishIt 捆绑工具对字体路径进行 url 编码，因此../fonts/fontawesome-webfont.eot?在 css 文件中更改为../fonts/fontawesome-webfont.eot%3F. 这通常返回 400，因为 %3F 被认为是不安全的。如果你设置了requestPathInvalidCharacters=""，那么%3F被认为是安全的，但显然没有文件``../fonts/fontawesome-webfont.eot%3F`，因此404。

我从捆绑包中删除了 fontawesome.css ，一切正常。