Microsoft CDN request fails with CORS error even though same request to underlying blob works fine

Question

Microsoft CDN request fails with CORS error even though same request to underlying blob works fine

David Cooper 0

I have an Azure storage blob that I use for video streaming. It has CORS settings in place. All works fine if point Shaka Player at a file URL - i.e. the video streams nicely.

However, I have also set up Microsoft.CDN to front end the container. If I browse to a blob file using a browser (using the azureedge.net domain name) the file is found and download offered.

However, when shaka player (video player) tries access the file via the same url, I get a MissingAllowOriginHeader CORS error reported .

The CORS settings haven't been changed since the CDN was setup up.

I have flushed browser cache.

I don't know what to do next to get the video file to play.

David Cooper 0 Reputation points

2025-06-05T10:35:08.66+00:00

Oh - BTW, I am only hitting this file from a single origin so I don't think the solution is to create an Azure Front Door rule.
Praveen Bandaru 5,520 Reputation points Microsoft External Staff Moderator

2025-06-05T17:15:51.25+00:00
Hello David Cooper

I understand that you're experiencing CORS errors when accessing your video files via Azure CDN, even though it works fine with the blob URL. Let’s break it down.

It seems the CORS settings on your Azure Storage account might not be allowing requests through your CDN. Here are a few steps to resolve the issue:

Double-check the CORS configuration in your Azure Storage account. Ensure you have allowed the origin of your Shaka Player requests. It should look like this:

Allowed origin: Your web application origin (e.g., ).

Allowed methods: Ensure GET is included.

Allowed headers: Make sure necessary headers for your requests are permitted.

Since your requests might involve preflight checks, make sure the OPTIONS method is permitted in your CORS settings. Open the browser's developer tools and inspect the network requests when accessing the video through the CDN. Look for any OPTIONS preflight request and see how it responds. This can provide clues about what's going wrong.

Check in the browser developer tool to determine from which path the CORS is being accessed, either from the custom domain level or the overall backend path level.

If you've recently set up the CDN or changed its configuration, keep in mind that it might take some time for the settings to propagate.

Additionally, for testing purposes, please try to create a ruleset at the front door level and observe the results.

And please share the below information for further investigation on the issue.

Can you share the exact CORS settings currently configured on your Azure Storage account?

Are there any specific error messages or codes in the browser's console that you can share?

What domain is Shaka Player hosted on, and does it differ from where your CDN is pointing?

Have you tested accessing the content from different browsers or devices to see if the issue persists?

Hope the above answer helps! Please let us know do you have any further queries. Please do not forget to "Accept the answer” and “up-vote” wherever the information provided helps you, this can be beneficial to other community members.
David Cooper 0 Reputation points

2025-06-05T20:07:32.34+00:00

Hi,

Thanks for responding.

The first thing to state is that CORS is working fine when the video player uses a URL pointing directly into the Blob. So, I know CORS for the storage account is configured correctly. It is only when the video player use a URL pointing to the azureedge.net domain that I get the problem.

See image: "Storage account CORS.png"

I have created a CDN rule.

See image: "CDN Rule.png"

The Shaka Player is hosted on www.yoreflix.online

See image: "Developer tools Headers.png"

I have tried it on several browsers. Firefox gives a bit more info than Chrome.

See images: "Firefox_1.png" and "Firefox_2.png"

The errors in Chrome are similar:

See images: "Developer tools CORS error.png" and "Developer tools Console.png"

CORS error images.pdf
Praveen Bandaru 5,520 Reputation points Microsoft External Staff Moderator

2025-06-09T17:55:20.64+00:00

Hello David Cooper

Verify the CORS configuration:

Check if the CDN resource causing the issue has the proper CORS configuration.

Ensure the 'Access-Control-Allow-Origin' header is present in the CDN response headers.

Confirm that the allowed origin matches the domain from which you are accessing the content.

Set up CORS rules:

If using Azure CDN Standard from Microsoft, configure CORS rules in the Azure portal.

Open the Azure portal, navigate to your CDN profile, go to the "CORS" settings, and add the necessary rules to allow the desired origins.

Clear the CDN cache:

The CDN cache might have the old configuration without the necessary CORS headers.

Clear the CDN cache for the affected content to ensure the new CORS configuration is applied.

1 answer

Your answer

David Cooper 0 Reputation points

2025-06-05T10:35:08.66+00:00

Oh - BTW, I am only hitting this file from a single origin so I don't think the solution is to create an Azure Front Door rule.
David Cooper 0 Reputation points

2025-06-05T20:07:32.34+00:00

Hi,

Thanks for responding.

The first thing to state is that CORS is working fine when the video player uses a URL pointing directly into the Blob. So, I know CORS for the storage account is configured correctly. It is only when the video player use a URL pointing to the azureedge.net domain that I get the problem.

See image: "Storage account CORS.png"

I have created a CDN rule.

See image: "CDN Rule.png"

The Shaka Player is hosted on www.yoreflix.online

See image: "Developer tools Headers.png"

I have tried it on several browsers. Firefox gives a bit more info than Chrome.

See images: "Firefox_1.png" and "Firefox_2.png"

The errors in Chrome are similar:

See images: "Developer tools CORS error.png" and "Developer tools Console.png"

CORS error images.pdf
Praveen Bandaru 5,520 Reputation points Microsoft External Staff Moderator

2025-06-09T17:55:20.64+00:00

Hello David Cooper

Verify the CORS configuration:

Check if the CDN resource causing the issue has the proper CORS configuration.

Ensure the 'Access-Control-Allow-Origin' header is present in the CDN response headers.

Confirm that the allowed origin matches the domain from which you are accessing the content.

Set up CORS rules:

If using Azure CDN Standard from Microsoft, configure CORS rules in the Azure portal.

Open the Azure portal, navigate to your CDN profile, go to the "CORS" settings, and add the necessary rules to allow the desired origins.

Clear the CDN cache:

The CDN cache might have the old configuration without the necessary CORS headers.

Clear the CDN cache for the affected content to ensure the new CORS configuration is applied.

Answer 1

Hi @David Cooper,

As per your rule set screenshot, the header value is set to "Access-Control-Allow-Origin", which is just the name of the header itself, not a valid origin.

User's image

The Access-Control-Allow-Origin header must have the domain name (like https://yoreflix.online) as its value, not the header name itself. Update the header value to your actual origin URL, e.g. https://yoreflix.online, instead of "Access-Control-Allow-Origin".

Below is the sample CORS setting
User's image

Once you update the ruleset configuration, make sure to purge the cached content on the Front Door endpoint to ensure that future responses include the updated Access-Control-Allow-Originheader.

I hope this is helpful! Do not hesitate to let me know if you have any other questions.

I really appreciate your feedback. It’s valuable to us. Please click Accept Answer on this post to assist other community members facing similar issues in finding the correct solution.

Venkat V 2,545 Reputation points Microsoft External Staff Moderator

2025-06-11T09:55:00.98+00:00

Hi @David Cooper,

I just wanted to follow up and see if you had a chance to review my response to your question. Please let us know if it was helpful, and feel free to reach out if you have any further queries.

Share via

Microsoft CDN request fails with CORS error even though same request to underlying blob works fine

1 answer

Your answer