即使在服务器中设置了Access-Control-Allow-Origin,Webfont也不会通过CloudFront加载

我想使用云端作为CDN来加速网站。 我已经得到了所有的JS和CSS工作正常,但我卡在一些不会从CDN加载的Web字体。

我用Access-Control-Allow-Origin使用以下语法设置了Apache VHOSTS文件:

 Header always set Access-Control-Allow-Origin "*.example.com" 

我是否将Access-Control-Allow-Origin放在了正确的域中,还是应该放在http://www.example.com ? 在这种情况下, http ://cdn.example.com是云端DNS的CNAME指向点。

当我curl时,我得到这样的标题:

 HTTP/1.0 200 OK Content-Length: 41012 Connection: keep-alive Date: Sun, 09 Jun 2013 20:59:30 GMT Server: Apache/2.2.22 (Ubuntu) Last-Modified: Fri, 04 May 2012 12:36:06 GMT Accept-Ranges: bytes Access-Control-Allow-Origin: *.example.com Age: 1805 Via: 1.0 cbe4bca697a4e3585803757de75edba7.cloudfront.net (CloudFront) X-Cache: Hit from cloudfront X-Amz-Cf-Id: 2im15Ds6Vk81kxdZKtPh7w0JUjW9qyPMgFbnXzrN_RfxJCkeyOjEbg== 

但是当我看着Firebug中的同一个文件时,我看不到Access-Control-Allow-Origin标题。

以这种方式在样式表中调用字体

 @font-face { font-family: 'TitilliumRegular'; src: url('TitilliumText1.eot'); src: local('Titillium Regular'), local('Titillium-Bold'), url('TitilliumText1.ttf') format('truetype'); } 

然后使用@import url("../fonts/titillium/stylesheet.css");导入到另一个@import url("../fonts/titillium/stylesheet.css");

我已经阅读了CORS和cloudfront上的各种post,据我所知,这些设置是正确的。 我错过了什么?

所以要解决上述问题需要两件事情:

  1. Access-Control-Allow-Origin从域转换为*
  2. 创build了一个新的CloudFront分配,因为几乎不可能使caching中的字体无效

一旦完成,一切正常。