的Cloudfront CORS阻挡字体除了字体负载

所有资产很好，每当我去我的网站我一直得到消息像这样的：从原点 “https://xxxxxxxxxx.cloudfront.net/assets/fontawesome-webfont.woff2” 的Cloudfront CORS阻挡字体除了字体负载

访问字体'https://example.com'已被CORS策略阻止：否 '所请求的资源上存在'Access-Control-Allow-Origin'标头。 'https://example.com'因此不允许访问。

正如你所看到的CURL命令表明没有头文件存在。

curl -H "Origin: https://example.com" -I https://xxxxxxxxx.cloudfront.net/assets/fontawesome-webfont.woff2 
HTTP/1.1 200 OK 
Content-Length: 77160 
Connection: keep-alive 
Status: 200 OK 
X-Rack-Cache: stale, valid, store 
Cache-Control: public, must-revalidate 
Date: Fri, 14 Apr 2017 08:01:26 GMT 
X-Content-Digest: d6f48cba7d076fb6f2fd6ba993a75b9dc1ecbf0c 
ETag: "2adefcbc041e7d18fcf2d417879dc5a09997aa64d675b7a3c4b6ce33da13f3fe" 
X-Runtime: 0.366713 
X-Request-Id: 87c9d883-e443-4756-86f9-66b40ed573f6 
X-Powered-By: Phusion Passenger Enterprise 5.1.2 
Server: nginx/1.10.2 + Phusion Passenger 5.1.2 
Via: 1.1 vegur, 1.1 f0eecbf6390179377707b707ebaa1e8b.cloudfront.net (CloudFront) 
Age: 86645 
Vary: Accept-Encoding 
X-Cache: Hit from cloudfront 
X-Amz-Cf-Id: FNjQGvROcAdqT6u6PaN3OgEE34mnSsixHNm6WqzWq2boWWYYzVmZPw==

这里的AWS原产地配置

这是包括上述产地的行为：

我甚至包括机架CORS到内的初始化项目的目的，但没有运气。

if defined? Rack::Cors 
    Rails.configuration.middleware.insert_before 0, Rack::Cors do 
    allow do 
     origins '*' 
     resource '/assets/*', headers: :any, methods: [:get, :post, :delete, :put, :patch, :options, :head], max_age: 0 
    end 
    end 
end

为什么这样，我该如何解决？先谢谢你。

来源

2017-04-14 Billy Logan

*正如你可以看到curl命令指示没有头是目前*你可以*也*从标题看，这请求根本没有通过CloudFront，因为'X-Amz-Cf-Id：...'，'Via：... cloudfront.net'和'X-Cache：... from cloudfront' headers are are全部丢失，并且这些头文件都不能被禁用。在这个问题上，CloudFront并不是一个促成因素。 –

@ Michael-sqlbot我更新了帖子。现在我有这些标题。接下来我可以做什么？ –

它看起来像你修正了错误的东西，那里。 CloudFront不在循环中，所以我的评论意见是您没有遇到CloudFront问题 - 问题在其他地方：您的应用没有返回必要的CORS响应标头。将CloudFront引入循环会让您的疑难解答变得更加复杂，因为现在您无法看到更改对您应用程序的影响 - 基于“Age：”标题的响应已有24小时的历史了。禁用缓存并在'*'上运行缓存失效。 –

我认为最常见的解决方案是使用font_assets宝石。配置非常简单。在config/environments/production.rb添加此

config.font_assets = "http://YOUR_ASSET_HOST"

可惜我不能更详细解释，但是这就是我们在我们的项目中使用，它工作正常。

来源

2017-04-14 15:27:19

它与Rails 5兼容吗？ –

不知道。自述文件说它适用于Rails 3.1，但它也适用于Rails 4.2，所以你可以试试看。 –

从Rails 5.0开始，it allows for setting custom HTTP Headers for assets，您不必添加诸如font_assets宝石之类的依赖关系。为了设置Access-Control-Allow-Origin您的字体，只需添加以下行config/environments/production.rb：

config.public_file_server.headers = { 
    'Access-Control-Allow-Origin' => '*' 
}

来源

2017-08-15 02:23:17

的Cloudfront CORS阻挡字体除了字体负载

回答

相关问题