Heroku和@font-face——嵌入式字体无法在Heroku上显示

Question

我有几个已授权的字体，使用CSS的@font-face标签将它们嵌入到我的Rails应用程序中。这些字体位于Rails 3应用程序中的"../Public/Fonts/"路径中，在任何本地机器上拉取存储库并运行时都能完美呈现。

但是，当我将我的应用程序推送到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") format("woff"),
url("../fonts/ChunkFive/ChunkFive-webfont.ttf") format("truetype"),
url("../fonts/ChunkFive/ChunkFive-webfont.svg") format("svg");
}

以下是我收到的每种字体的404资源未找到消息：

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

奇怪的是，它可以在同一根文件夹中找到并加载样式表、图标和图片。再次强调，字体嵌入并且可以在本地服务器上运行得非常完美，即使在没有安装该字体的主机上也可以正常工作。

我在网上找到了一个人遇到了类似的问题，他更改了config.ru和environment.rb文件，使其与Heroku兼容，但我似乎找不到这个文件了。

非常感谢您提前给予的帮助！

~Dan

- thoughtpunch

---

你有检查 Heroku 日志，确认文件请求是否到达了应用服务器吗？ - hornairs

尝试在 config.ru 中添加 use Rails::Rack::Static。 - Zabba

我应该将这行代码添加到“config.ru”文件中还是替换当前内容？ - thoughtpunch

当前文件包含以下数据：require ::File.expand_path（'../config/environment'， __FILE__） 运行 RESUME :: Application - thoughtpunch

为什么不尝试使用url("/fonts/")而不是url("../fonts/")呢？ - montrealmike

为什么要“licensed”？_Chunk_是开源的。 - Félix Saparelli

Answer 1

事实证明，资源的根目录被设置为Public/Stylesheets，因此我在font-face部分的路径声明是没有意义的。我采取了简单的方法，将字体移动到样式表目录下，现在一切都完美地工作了！

- thoughtpunch

---

谢谢回答。你应该将自己的答案标记为正确答案。 - Scott Willeke

Answer 2

这是一个在Heroku上工作的示例：http://www.arailsdemo.com/posts/12 这是相应的样式表：http://www.arailsdemo.com/stylesheets/application.css 我不记得需要进行任何配置更改。希望对你有所帮助。

- monocle

Answer 3

字体目录：app/assets/fonts/

将以下行添加到production.rb中

config.serve_static_assets = true

在你的 styles.css.scss 文件中

@font-face {
  font-family: "mycustomfont";
  src:url(asset_path("mycustomfont.eot"));
  src:url(asset_path("mycustomfont.eot?#iefix")) format("embedded-opentype"),
    url(asset_path("mycustomfont.ttf")) format("truetype"),
    url(asset_path("mycustomfont.svg#mycustomfont")) format("svg"),
    url(asset_path("mycustomfont.woff")) format("woff");
  font-weight: normal;
  font-style: normal;
}

环境：Rails 4.0.1 Ruby 2.0.0-p247

应该可以在Heroku上运行 :)

- vitormil