2

首先让我先说在 Ruby 和 Rails 方面我是一个完全的新手，所以希望我没有犯一个菜鸟错误。

我已经找到了一个已成功部署到 heroku 的应用程序的源代码；并在开发模式下运行它工作正常，但是当我将其切换到生产模式时，图像不会显示。

该应用程序正在使用assets_sync Gem，并且应该使用 S3 存储桶从 AWS 提供图像以及其他资产。css 和 js 文件正确通过，但图像不正确。这篇文章很好地解释了它应该如何工作 https://firmhouse.com/blog/complete-guide-to-serving-your-rails-assets-over-s3-with-asset_sync

据我所知，css 和图像是预编译的；使用从 sass 生成的 css，并将图像组合成一个精灵。我发现这篇文章对于解释这里发生的事情很有用http://compass-style.org/help/tutorials/spriting/（对于有经验的 Rails 开发人员来说可能没什么新东西）

如果我深入挖掘并查看正在运行的应用程序的 css，则背景图像 url 属性缺少 url 中的存储桶名称。

这是一个例子；我确定这部分//.s3应该是//mybucket.s3：

someclass {
    background: url(http://.s3.amazonaws.com/assets/myicon.png)
}

如果我把网址直接放在浏览器地址栏中 - 没有图像！。但是，只要我添加存储桶名称，就会下载图像。即以下工作，确认图像存在于 s3 存储桶中。

http://my-bucket.s3.amazonaws.com/assets/myicon.png

这意味着 css 未正确预编译，并且可能无法从配置中找到存储桶名称。

我检查了heroku 配置是否正确。使用以下设置：

  • FOG_PROVIDER,
  • AWS_ACCESS_KEY_ID
  • AWS_SECRET_ACCESS_KEY
  • FOG_DIRECTORY
  • FOG_REGION

我花了相当多的时间在谷歌上搜索这个问题而没有结果。那么有没有人以前见过这个问题，或者提出了解决问题的方法？

4

1 回答 1

2

好的，欢迎来到 Rails 社区！

预编译

通过我们自己使用asset_sync gem，我能给出的最好建议是在推送到Heroku 之前在本地进行预编译。此外，您必须做几件事才能使其正常工作：

  1. 你需要asset_path_helpers在你的 CSS中使用
  2. 您需要asset_path为您的生产环境更改，以反映 S3 实现

这是您需要做的：

--

预处理

#app/assets/stylesheets/application.css.scss #-> notice the SCSS
someclass {
    background: asset_url("myicon.png")
}

您需要使用Rails中的一种 css 预处理器（基本上是 SCSS），以使您能够使用动态资产路径助手。这是第一步，因为它将正确引用您的资产。

--

资产托管

其次，您需要更改文件中的asset_host/config/environments/production.rb：

#config/environments/production.rb
config.action_controller.asset_host = "//#{ENV['FOG_DIRECTORY']}.s3.amazonaws.com"

这将允许 Rails 在您创建资产路径时为其添加正确的 URL，从而允许您从S3

--

最后，在使用asset_sync. 我忘记了原因，但本质上是按照正确的顺序获取所有文件等：

$ rake assets:precompile RAILS_ENV=production

这允许asset_sync上传正确运行所需的文件。或者至少应该:)

于 2014-08-13T08:02:01.953 回答