Resource Sharing Issue (CORS)
I store a font (font-awsome) in a Rackspace CDN and use it on my website. The font won't load and the error message is:
Font from origin 'http://some address.rackcdn.com' has been blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://www.my domain.com' is therefore not allowed access.
I know this is a CORD issue, so I used the rackspace API to set Access-Control-Allow-Origin for both container and file Access-Control-Allow-Origin: *
. Checking with the command curl
:
curl -I -X HEAD http://some addresss.rackcdn.com/production/assets/fontawesome-webfont-5019d8b3ed6173ce677c8fb2cfaf70c4.ttf
Result:
HTTP/1.1 200 OK
Last-Modified: Wed, 10 Sep 2014 07:20:04 GMT
ETag: c4668ed2440df82d3fd2f8be9d31d07d
X-Timestamp: 1410333603.37481
Access-Control-Allow-Origin: *
Content-Type: application/x-font-truetype
X-Trans-Id: txbcf7f6de9f7848359081c-00540ffbd4dfw1
Cache-Control: public, max-age=259176
Expires: Sat, 13 Sep 2014 07:20:28 GMT
Date: Wed, 10 Sep 2014 07:20:52 GMT
Connection: keep-alive
I can also download the font by typing the URL into the address bar in the browser. However, I still cannot use this font on my website, the previous error message still exists.
I also tried to check with javascript:
request = new XMLHttpRequest()
request.open('GET', 'http://my file url);
request.send(null)
Error message
XMLHttpRequest cannot load http://my file url. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://www.google.com' is therefore not allowed access.
Seems Access-Control-Allow-Origin: *
not enough for a CORS problem. What do I need to add to the CDN header configuration in rackspace / or my website in order to use a font from the Rackspace CDN?
Thank!
source to share
No one has answered this question yet
Check out similar questions: