【发布时间】：2016-11-08 17:01:50
【问题描述】：
我在应用程序中使用的引导字形图标仅适用于 safari，不适用于 chrome 或 firefox。下面给出了字形图标的图像。
我正在使用 cloudfront 来托管所有静态内容。 我之前发布了一个类似的问题，答案指出 CDN 上的配置可能是问题所在，因为它在开发中运行良好。我对 CDN 所做的更改如下所示。
提到的将生产环境主机名列入白名单的答案。我点击了“分发”、“分发设置”和“行为”选项卡，然后点击了“编辑”。 我将“转发标头”从“无（改进缓存）”更改为“白名单”。将出现“白名单标题”部分，我将“主机”添加到列表中。这是我可以将主机名“列入白名单”的唯一地方。我不确定我是否正确地做到了这一点。
它仍然无法在 chrome 上运行。我尝试使用 firefox 来查看 chrome 是否是问题所在，但它也不适用于 firefox。它仅适用于 safari。
我在生产环境中也设置了config.serve_static_files = true。
正如我所提到的，我之前发布了一个类似的问题，但没有解决方案。任何帮助将不胜感激。谢谢！
查看 chrome 控制台后，我看到以下错误。
https://d24b01zeuxnthb.cloudfront.net/assets/bootstrap/glyphicons-halflings…gular-bd18efd3efd70fec8ad09611a20cdbf99440b2c1d40085c29be036f891d65358.ttf Failed to load resource: the server responded with a status of 404 (Not Found)
https://d24b01zeuxnthb.cloudfront.net/assets/sprites/social-share-button@2x-a597120b30fe6ae4ac5b4f0f45f307c0f5519851529b3010a7c584eb3ed186be.png Failed to load resource: the server responded with a status of 404 (Not Found)
Font from origin 'https://xxxxxxxxx.cloudfront.net' has been blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://scorecliq.herokuapp.com' is therefore not allowed access.
【问题讨论】：
-
你有没有检查过Chrome开发者工具控制台看是否有资源加载相关的错误？
-
您可能有 2 个不同的问题，但我建议您快速浏览一下 AWS Cloudfront Forward Header Caching Conflicts，网址为：docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/…docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/… 您还可能需要将参考列入白名单也可以连接到您的开发环境中的 CDN。我总是查看呈现的浏览器版本中的代码，以确保对文件的引用是正确的。
-
@MarceloMartins，我将用查看 chrome 控制台时遇到的错误更新我的问题。
-
“我正在使用云端托管所有静态内容。” 这不可能是准确的。 CloudFront 不“托管”任何内容。内容托管在原始服务器上，位于 CloudFront 之后，并且该服务器的日志（我不相信您在这里提到过）是您需要阅读的内容。
-
@Michael-sqlbot，我的术语并不完全准确，是的，我的静态内容托管在我的源服务器上，该服务器被云端缓存，因此它可以服务于未来的请求。感谢您指出这一点，尽管它没有提供任何帮助。
标签： twitter-bootstrap google-chrome ruby-on-rails-4 heroku amazon-cloudfront