未提供 Rails Cloudfront 资产

Posted

技术标签:

【中文标题】未提供 Rails Cloudfront 资产【英文标题】:Rails Cloudfront assets not served 【发布时间】:2016-05-22 02:11:17 【问题描述】:

我使用 Heroku for Rails 设置 Cloudfront,一开始它运行良好。我注意到在最后几天不再从 cloudfront.net 提供资产。

Production.rb

Rails.application.configure do
  config.cache_classes = true
  config.eager_load = true
  config.consider_all_requests_local       = false
  config.action_controller.perform_caching = true
  config.action_controller.asset_host = 'http://d2t6o5tnu5etuf.cloudfront.net'
  config.serve_static_files = true
  config.assets.js_compressor = :uglifier
  config.assets.css_compressor = :sass
  config.assets.compile = true
  config.assets.digest = true
  config.assets.version = '1.0'
  config.log_level = :info
  config.i18n.fallbacks = true
  config.active_support.deprecation = :notify
  config.log_formatter = ::Logger::Formatter.new
  config.active_record.dump_schema_after_migration = false
end

我可以访问云端地址下的所有资产,在 chrome 中我可以看到 application-5deb6995ce9b984d469b27c58cc92a095d19cd13e0acd622ffe426c41826e055.js 从云端服务器获得服务。但是页面上的所有静态图像,例如/assets/shop/banners/2.jpg 没有。

似乎和预编译有关,因为它不寻找文件的指纹版本,或者?

在我的 gem 文件中,我包含以下内容:

group :production, :staging do
      gem 'rails_12factor'
      gem 'pg'
 end

【问题讨论】:

您是在使用助手image_tagimage_url 来显示您的图像吗? 我猜我需要这样做? 是的,如果你使用图像助手,rails 会在你的图像前面加上config.action_controller.asset_host 中定义的值。请参阅devcenter.heroku.com/articles/… 了解更多信息。 【参考方案1】:

正如 tegon 指出的那样,需要 image_tag 或 image_url 来提供来自云端的资产。我的代码中有通常的“img src”引用,无法识别。

将 img src 更改为 image_tag 或 image_url 并且它正在工作。谢谢!

【讨论】:

【参考方案2】:

这是一个使用 CloudFront 的 Rails 5.2 应用示例:https://github.com/nzoschke/edgecors

除了asset_host,您还应该为您的资产配置Cache-Control 标头。这样 CloudFront 几乎永远缓存了不可变的 application-5deb6995ce9b984d469b27c58cc92a095d19cd13e0acd622ffe426c41826e055.js 命名资产。

Rails.application.configure do
  config.action_controller.asset_host = "https://d372g5jsa84e2.cloudfront.net"
  config.public_file_server.headers = 
    'Cache-Control' => 'public, max-age=31536000'
  
end

与上面的 cmets 一样,使用资产管道 url 助手。以下是 SCC font-url 助手的示例:

@font-face 
  font-family: 'Inconsolata';
  src: font-url('Inconsolata-Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;


body 
  font-family: "Inconsolata";

【讨论】:

以上是关于未提供 Rails Cloudfront 资产的主要内容,如果未能解决你的问题,请参考以下文章

Rails 3 自动资产部署到 Amazon CloudFront?

Rails 应用程序 - 使用 Cloudfront 和 Heroku 进行资产交付

如何通过 https 和 heroku 上的 rails 服务云端资产?

Rails assets_host、cloudfront 和 heroku

Rails 5生产资产管道CSS未呈现

使用 Amazon S3 和 Cloudfront 的 CORS