rails/Heroku：自定义字体在本地工作，但在 Heroku 上不工作答案

【问题标题】：rails/Heroku: custom fonts working in local but not on Herokurails/Heroku：自定义字体在本地工作，但在 Heroku 上不工作
【发布时间】：2014-02-06 23:03:05
【问题描述】：

我在 Rails 4 上的自定义字体有问题。

我将字体放在 /vendor/assets/fonts/ 目录中，并在我的 application.rb 中添加：

config.assets.paths << "#{Rails}/vendor/assets/fonts"
config.assets.precompile << /\.(?:svg|eot|woff|ttf)$/

另外，在我的 production.rb 配置文件中，我有：

config.serve_static_assets = true

我在我的 css 中使用 sass，所以我补充说：

@font-face
  font-family: 'Raleway-Thin'
  src: url('Raleway-Thin.ttf')

....
font-family: "Raleway-Thin", sans-serif

在我的 application.css 中，我还添加了因为我使用的是 font-awesome：

 *= require font-awesome.min

我正在推动 Heroku，但我的字体未加载，无法正常工作...

请问您有什么问题吗，（或者是否有任何命令可以在推送之前/之后键入）？

提前致谢

【问题讨论】：

您是否在浏览器中收到 404？也就是说，浏览器是否尝试加载字体文件并说“找不到它们”？
您的字体和 Rails 应用程序是否来自同一个域？因为如果您使用 AmazonS3 或 CloudFront 作为资产，您应该在亚马逊控制台中配置 CORS
我有一个在 heroku 上成功运行并提供字体的应用程序。我们的生产配置中有这个config.serve_static_assets = false，一切都在为我们工作。您是否有理由希望 Rails 为您的静态资产提供服务（不是瘦身或独角兽）？
没有我的字体包含在供应商目录的项目中。我得到了页面，只是没有字体..字体真棒用正方形替换我的字体...
您的浏览器是否显示（在网络调用列表中）它正在寻找字体文件？却找不到 (404)？

标签： css ruby-on-rails ruby heroku fonts

【解决方案1】：

您是否尝试过使用辅助函数并利用 Rails 资产管道？

@font-face
  font-family: 'Raleway-Thin'
  src: font-url('Raleway-Thin.ttf')

【讨论】：

这看起来是正确的答案。您也可以尝试url('/assets/Raleway-Thin.ttf')，这应该是 font-url 方法为您提供的（可能带有摘要除外）。
不，它也不会改变。我忘了提到我的 Gemfie 中有：gem 'rails_12factor', group: :production
因为您使用的是 Rails 4。我认为使用资产管道构建的资产都具有摘要扩展。这意味着 url('Raleway.ttf') 将不匹配，因为该文件可能称为 Raleway-Thin-4444e3cae9b52ca.ttf （或类似名称）。这就是为什么感觉 font-url 助手应该提供帮助的原因。当它到位时，来自浏览器的字体文件请求是否在文件名中包含摘要？
我不确定是否理解，使用 font-url 助手，我得到同样的错误：加载资源失败：服务器响应状态为 404（未找到）

【解决方案2】：

您可以将字体导入文件夹 assest/stylesheet/font 并在部署到 heroku 之前运行 bundle exec rake assets:precompile。我已经尝试过了，它的工作。另外，我有你用过的搜索字体名称，所以我建议你可以使用谷歌网络字体来搜索这个字体：http://www.google.com/fonts#UsePlace:use/Collection:Raleway

【讨论】：

可能是一个解决方案，但我有一些其他字体需要包含在我的项目中..