使用 rack-cors 与 Rackspace CDN 问题

Using rack-cors with Rackspace CDN issues

我有一个 rails 4.2 应用程序使用 rack-cors。 None 我的 font-awesome 图标显示,即使我的所有其他资产都很好。我正在使用 rackspace cdn。我的 CDN url 看起来像

http://ddf908e003b5678bc25-9d6bfcdc12345678ba868a15bca98.r12.cf5.rackcdn.com/assets/main-4f3595479ce96112e1b8ab4e5357fc26.css

我的 rack-cors 配置在我的 config/application.rb

config.middleware.insert_before 0, "Rack::Cors" do
  allow do
    origins 'localhost:3000', /^http:\/\/\w+.+rackcdn.com/
    resource '/assets/*', headers: :any, methods: :get
  end
end

图标在本地显示得很好。只有在生产中他们才不会展示。关于我可能遗漏的任何想法?

编辑

我正在使用 font-awesome-sass gem。当我查看页面时,我没有收到任何 javascript 错误或任何内容,只有 CORS 警告,没有图标。

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://ddf908e003b5678bc25-9d6bfcdc12345678ba868a15bca98.r12.cf5.rackcdn.com/assets/main-4f3595479ce96112e1b8ab4e5357fc26.css/assets/font-awesome/fontawesome-webfont-e9c0e802c2b0faf4d660e2bff17b5cf1.woff. This can be fixed by moving the resource to the same domain or enabling CORS.

编辑 2

我正在使用 asset_sync 来帮助设置 Ash Wilson 建议的自定义 headers。

AssetSync.configure do |config|
  config.fog_provider = 'Rackspace'
  config.rackspace_username = ENV['RACKSPACE_USERNAME']
  config.rackspace_api_key = ENV['RACKSPACE_API_KEY']
  config.fog_directory = ENV['FOG_DIRECTORY']
  config.fog_region = ENV['FOG_REGION']
  config.gzip_compression = true
  config.manifest = true
  config.custom_headers = {
    "\.(ttf|otf|eot|woff|svg)$" => {
      "Access-Control-Allow-Origin" => "*",
      "Access-Control-Request-Method" => "*",
      "Access-Control-Allow-Methods" => "*"
    }
  }
end

我这边还没有做任何缓存,但我肯定会清除所有浏览器缓存。正如 Ash 在下面提到的那样,我还在控制面板中发现了 2 个抱怨 .woff.ttf 的文件,我手动将 headers 添加到其中。但是,我仍然看到同样的问题。也许还有一个额外的步骤,或者 AssetSync 可能已经死了并且不起作用?

编辑 3

这是来自 curl 的 headers。看起来 CORS headers 在那里。繁殖等了一整天,还是不行

curl -i -s -XHEAD http://ddf908e003b5678bc25-9d6bfcdc12345678ba868a15bca98.r12.cf5.rackcdn.com/assets/font-awesome/fontawesome-webfont-e0e0f28a0197446b28f818aa81b80530.ttf

HTTP/1.1 200 OK
Content-Length: 112160
Last-Modified: Thu, 07 May 2015 16:49:12 GMT
Accept-Ranges: bytes
Access-Control-Request-Method: *
ETag: c4668ed2440df82d3fd2f8be9d31d07d
X-Timestamp: 1431017351.82062
Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: GET, HEAD, OPTIONS
Content-Type: application/font-sfnt
X-Trans-Id: tx53b90a9b638141c6874e6-00554bf992iad3
Cache-Control: public, max-age=259200
Expires: Sun, 10 May 2015 23:47:30 GMT
Date: Thu, 07 May 2015 23:47:30 GMT
Connection: keep-alive

要让 CORS 正常工作,您需要在 Rackspace 端的云文件 object 上设置 CORS headers,而不是您的应用程序提供的文件。您可以通过单击每个文件旁边的齿轮图标从 control panel 执行此操作:

Cloud Files documentation 包含有关支持的 CORS headers 及其含义的部分。

如果您有大量资产,或者有一个自动发布它们的构建过程,您需要使用 API 或 SDK 来设置它们。 developer documentation 包含一个代码片段,您可以采用该代码片段来执行此操作;将 "Access-Control-Allow-Origin" 或其他相关的 headers 替换为 "Content-Type".

这是一个使用 Ruby SDK,Fog 的完整示例:

require 'fog'

# Authenticate
@client = Fog::Storage.new(
  :provider => 'rackspace',
  :rackspace_username => '{username}',
  :rackspace_api_key => '{apiKey}',
  :rackspace_region => '{region}'
)

# Find the file object
@directory = @client.directories.get("{container name}")
@file = @directory.get("{file name}")

# To only allow CORS requests from a page hosted at 'my-domain.com'
# You can also set this to '*' to allow CORS requests from anywhere
@file.access_control_allow_origin = "http://my-domain.com"
@file.save