@ font-face在localhost上正常工作但在AppHarbor中没有

Question

我在AppHarbor上托管我的应用程序时遇到了问题.我在.net MVC 3上有一个基本的应用程序.在这个应用程序中,我使用了@ font-face属性来显示自定义字体中的内容:

@font-face {
font-family: facefont;
src: url("raleway_thin.otf");
} 
body {    
font-size: .85em;
font-family: "facefont", Verdana, Helvetica, Sans-Serif;
margin: 0;
padding: 0;
color: #696969;
}

当我通过loaclhost中的开发服务器运行此应用程序时,所有内容都以自定义字体显示.但是当我在AppHarbor上推送我的webapp时:

appapp over AppHarbor

它不再显示我在.css中使用的自定义字体中的内容.我很困惑,因为我使用相同的浏览器(Chrome 15.0)来查看它们,但它们给出了不同的结果.

请帮助.

---

我刚刚解决了这种情况只发生在字体文件[*.otf,*.ttf] ..我把一个图像放在同一个文件夹中并且它已被完美地添加但是它再次无法获取字体文件并显示404结束它.

---

还完成了配置mimeTypes:

<staticContent>
        <mimeMap fileExtension=".otf" mimeType="font/otf" />
        <mimeMap fileExtension=".ttf" mimeType="application/octet-stream" />
    </staticContent>

Answer 1

为了将".woff"格式字体部署到Appharbor,我必须做两件事:

1:在我的visual studio项目中包含该字体,确保它的"Build"属性设置为"Content"(如上所述@Korayem)
2:将以下配置添加到Web.config:

<system.webServer>
    <staticContent>
        <remove fileExtension=".woff"/>
        <mimeMap fileExtension=".woff" mimeType="application/x-font-woff" />
    </staticContent>
</system.webServer>

Answer 2

您的样式表在您的页面引用它的位置不可用.这个网址提供500:http://testapp-216.apphb.com/Content/Site.css

您应该验证AppHarbor是否部署了相关的.css和字体文件.通过从AppHarbor下载构建输出包并检查其内容,可以轻松完成此操作.如果它不存在,您很可能需要在项目文件参考中将"构建操作"设置为"内容".

正确配置mimetypes也很重要.

(免责声明,我是AppHarbor的联合创始人)