Heroku和@ font-face - 嵌入的字体不会显示在Heroku上 [英] Heroku and @font-face - embedded fonts wont display on Heroku

问题描述

我有一些使用CSS @ font-face 标签嵌入我的Rails应用程序的许可字体。这些字体位于我的Rails 3应用程序中的../ Public / Fonts /路径，并完美地渲染任何本地机器，我拉下repo，运行。

然而，当我把我的应用程序推送到Heroku时，似乎找不到字体。你可以告诉它在字体目录中查找，但永远不能访问它们。在@ font-face声明中我放置字体或如何输入字体路径似乎没有问题。

我的字体位于＃{RAILS.root} / public / fonts / ChunkFive

这是我的@ font-face声明：

  @ font-face {
 font-family：ChunkFive; 
 src：url（../ fonts / ChunkFive / ChunkFive-webfont.eot）; 
 src：local（？），
 url（../ fonts / ChunkFive / ChunkFive-webfont.woff）格式（woff），
 url /fonts/ChunkFive/ChunkFive-webfont.ttf）格式（truetype），
 url（../ fonts / ChunkFive / ChunkFive-webfont.svg）格式（svg）; 
} 
  

这里是每个字体的404资源找不到的消息： p>

 请求网址：http：//thedanbarrett.heroku.com/fonts/ChunkFive/ChunkFive-webfont.woff 
请求方法：GET 
状态码：404未找到
请求头
查询者：http：//thedanbarrett.heroku.com/home 
 User-Agent：Mozilla / 5.0 ; Windows NT 6.1; en-US）AppleWebKit / 534.10 
（KHTML，like Gecko）Chrome / 8.0.552.224 Safari / 534.10 
响应头
年龄：0 
连接：keep -alive 
 Content-Length：727 
 Content-Type：text / html 
日期：2011年1月5日星期三15:25:21 GMT 
服务器：nginx / 0.7.67 
 Via：1.1 varnish 
 X-Runtime：0.001344 
 X-Varnish：764492621 
  

奇怪的是，它在同一根文件夹中查找并加载样式表，图标和图像。只是重申的字体嵌入和工作完美运行从本地服务器，即使在没有安装的字体的主机上。

我在网上找到一个参考这是一个类似的问题，他们改变了 config.ru 和 environment.rb 文件，使其与Heroku友好，但我似乎找不到它。

提前感谢您的帮助！

〜Dan

公共/样式表所以我的路径声明在font-面部是无意义的。我把easy和移动样式目录下的字体，一切工作完美了！

I have a few licensed fonts that I have embedded into my Rails app using the CSS @font-face tag. These fonts are located in the "../Public/Fonts/" path in my Rails 3 app and render perfectly on any local machine that I pull down the repo and run on.

However when I push my app to Heroku it can't seem to find the fonts. You can tell that it's looking in the font directory but can never access them. It doesn't seem to matter where I place the fonts or how I type the font path in the @font-face declaration.

My fonts are located at #{RAILS.root}/public/fonts/ChunkFive

Here is my @font-face declaration:

@font-face {
font-family: "ChunkFive";
src: url("../fonts/ChunkFive/ChunkFive-webfont.eot");
src: local("?"),
url("../fonts/ChunkFive/ChunkFive-webfont.woff") format("woff"),
url("../fonts/ChunkFive/ChunkFive-webfont.ttf") format("truetype"),
url("../fonts/ChunkFive/ChunkFive-webfont.svg") format("svg");
}

Here is the 404 resource not found message I get for each font:

Request URL:http://thedanbarrett.heroku.com/fonts/ChunkFive/ChunkFive-webfont.woff
Request Method:GET
Status Code:404 Not Found
Request Headers
Referer:http://thedanbarrett.heroku.com/home
User-Agent:Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US) AppleWebKit/534.10 
(KHTML,like Gecko) Chrome/8.0.552.224 Safari/534.10
Response Headers
Age:0
Connection:keep-alive
Content-Length:727
Content-Type:text/html
Date:Wed, 05 Jan 2011 15:25:21 GMT
Server:nginx/0.7.67
Via:1.1 varnish
X-Runtime:0.001344
X-Varnish:764492621

The strange thing is that it finds and loads stylesheets, icons, and images in the same root folder. Just to reiterate the fonts embed and work perfectly run from a local server, even on hosts that don't have the font installed.

I did find one reference online to someone that was having a similar issue who changed their config.ru and environment.rb files to make it friendly with Heroku, but I can't seem to find it.

Thanks in advance SO minions for all your help!

~Dan

解决方案

So it turned out the root for resources was set to Public/Stylesheets so my path declaration in the font-face section was nonsensicalness. I took the easy out and moved the fonts under the stylesheets directory and everything works perfectly now!

这篇关于Heroku和@ font-face - 嵌入的字体不会显示在Heroku上的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！