ruby-on-rails - Rails 3，@font-face 在使用 Firefox 的生产中失败

Question

我正在使用 font-awesome在 rails 3 应用程序中，在开发模式下一切正常，但是当我推送到 Heroku 时，Firefox 无法呈现图标，相反，我看到了:

Chrome 在开发和生产中渲染图标很好

这只会影响 FireFox(虽然我没有尝试过 IE)

该应用程序是 here ，如果有人能确认这不仅仅发生在我的机器上(帮助我排除本地主机缓存问题)，我将不胜感激。

所有 Assets ，包括字体和样式表，都使用 asset_sync 托管在 S3 上。 gem 。

这是我所做的:

在 font-awesome.css.scss 的顶部添加了以下内容:**

// font-awesome.css.scss
@font-face {
  font-family: 'FontAwesome';
  src: font-url("fontawesome-webfont.eot");
  src: font-url("fontawesome-webfont.eot?#iefix") format("eot"),
       font-url("fontawesome-webfont.woff") format("woff"),
       font-url("fontawesome-webfont.ttf") format("truetype"),
       font-url("fontawesome-webfont.svg#FontAwesome") format("svg");
  font-weight: normal;
  font-style: normal;
}

然后我把它放在 application.rb 中:

# application.rb
config.assets.paths << Rails.root.join("app", "assets", "fonts")
config.assets.precompile += %w( .svg .eot .woff .ttf )

最后我将所有 4 个字体文件放在 app/assets/fonts 中.

我真的很想知道我在这里做错了什么。

Answer 1

这是我添加到 AWS 管理控制台中的存储桶以配置此交叉事物的配置:

登录 AWS -> AWS 管理控制台 -> S3 -> 查找您的存储桶 -> 推送属性按钮(出于某种原因在纸上放大镜)-> 右侧的 Clic PERMISSIONS ->“编辑 CORS 配置”

<CORSConfiguration>
    <CORSRule>
        <AllowedOrigin>*</AllowedOrigin>
        <AllowedMethod>GET</AllowedMethod>
        <MaxAgeSeconds>3000</MaxAgeSeconds>
        <AllowedHeader>Content-*</AllowedHeader>
        <AllowedHeader>Host</AllowedHeader>
    </CORSRule>
</CORSConfiguration>

经过两个小时的研究...... :-(