implementing Azure Blob Storage CORS settings not being respected in Angular app
I'm experiencing issues with CORS settings for my Azure Blob Storage when accessing it from my Angular application. I've set up CORS in the Azure portal to allow requests from my application's domain (e.g., https://myangularapp.com). However, I'm still working with a `CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.` behavior when trying to fetch images stored in the Blob Storage. To troubleshoot, I've verified that the CORS settings include the correct allowed origin and methods. Here's what I configured: - Allowed Origins: `https://myangularapp.com` - Allowed Methods: `GET, POST, OPTIONS` - Allowed Headers: `*` - Exposed Headers: `*` - Max Age: `3600` In my Angular service where I fetch the images, I'm using the HttpClient like this: ```typescript import { HttpClient } from '@angular/common/http'; import { Injectable } from '@angular/core'; @Injectable({ providedIn: 'root' }) export class ImageService { constructor(private http: HttpClient) {} getImage(imageName: string) { return this.http.get(`https://<yourstorageaccount>.blob.core.windows.net/<yourcontainer>/${imageName}`, { responseType: 'blob' }); } } ``` I also tried calling the Blob Storage URL directly from my browser and the CORS behavior continues. I've waited for several hours after making the changes to the CORS settings, but nothing seems to work. Is there something I'm missing, or is there a known scenario with CORS in Azure Blob Storage that I am not aware of?