locked
Content blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' RRS feed

  • Question

  • Hello Team, 

    We have a publicly accessible server where we uploaded some fonts to use on our website. We are accessing the font URLs over https.

    Now we would like to use Azure CDN for accessing the fonts. For this, we have  created a standard Verizon CDN profile with one endpoint.

    When we  access the font URL from browser with endpoint, its working fine. But when we try to access it via python code form another server using the same endpoint, we are getting following error :

    Font from origin 'https://<endpoint>.azureedge.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://<our-domain>' is therefore not allowed access.

    Can you please help us to fix this issue?

     
    Sunday, September 25, 2016 12:05 PM

All replies

  • Hi BusinessClouds,

    You will need to make sure your font server is sending a Access-Control-Allow-Origin header with either * or the domain of the server you are requesting it from.

    Please see our full documentation for more details https://azure.microsoft.com/en-us/documentation/articles/cdn-cors/

    Hope that helps, and feel free to reach out again if you continue having issues.

    Thanks,

    Richard

    Monday, September 26, 2016 9:37 PM
  • Thanks for your reply. 

    Its working fine with our own font server (We have added Access-Control-Allow-Origin "*" on apache config)

    But when we use the origin as github.com , its not working . We are getting the error message as

    Redirect at origin 'https://cdn.azureedge.net' has been blocked from loading by Cross-Origin Resource Sharing policy: The 'Access-Control-Allow-Origin' header has a value 'https://render.githubusercontent.com' that is not equal to the supplied origin. Origin 'https://<our domain> is therefore not allowed access.

    Is it possible to fix from our side ?


    Tuesday, September 27, 2016 7:33 AM
  • What do you mean by "use the origin as github.com"? Is the CDN endpoint pointing to a github.com domain? Sample URL from client illustrating issue along with response headers you get back would be very helpful for helping you resolve this issue.
    Tuesday, September 27, 2016 7:49 AM
  • Yes, the CDN endpoint points to "github.com"

    Can we do anything from Azure CDN to get this fixed?

    Tuesday, September 27, 2016 11:31 AM
  • Hello,

    Providing the headers from the response/request would help us understand better.

    As I understand it, you're trying to do a CORS request to github.com which just has a single origin in the access control origins. If you're not able to In that case you can use the Rules Engine in Verizon to add the correct access control headers.

    See the Verizon Premium examples from https://azure.microsoft.com/en-us/documentation/articles/cdn-cors/#multiple-origin-scenarios to correctly set up your matches and rules. You'll find two options there: Using a regex match, or using a request header match for each origin you want allowed.

    Tuesday, September 27, 2016 5:43 PM
  • Thanks for your reply. 

    To make things easier, we are planning to use azure storage as Origin

    Here are the things we tried :

    1) Created a container on one of our storage account and uploaded the fonts to that container as Blob (say, abc)

    2) The direct URL for Blob is working fine. https://<storage_account>.blob.core.windows.net/abc/font1.ttf

    3) Then we have created Verizon Premium CDN profile, created an endpoint  (say, cdn.azureedge.net) with  origin as storage.

    4) Also we have added Rules on Rules Engine. 

    

    5) When we access the CDN URL, https://cdn.azureedge.net/abc/font1.tt is working fine. But when we try with code, getting the following error

    https://cdn.azureedge.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://<our-domain>' is therefore not allowed access.

    Please help us  to fix this. 

    Wednesday, September 28, 2016 12:01 PM
  • If the final goal is to use storage as origin and allow access to everyone, theres no need to use the rules engine. You can simply set the header on the blob itself to *.

    https://blogs.msdn.microsoft.com/windowsazurestorage/2014/02/03/windows-azure-storage-introducing-cors/

    https://msdn.microsoft.com/library/azure/dn535601.aspx

    Regarding your rule, there could be a couple things. The rule takes a while to take effect (2 hrs sometimes). Can you share your CDN URL so I may test?


    Thursday, September 29, 2016 11:09 PM
  • Thanks Richard

    I enabled CORS on storage blob and the issue fixed for me.  Now the CDN works fine. 

    Sunday, October 2, 2016 10:21 AM