Unable to access Azure blob SAS uri in SwaggerUIBundle url list

I'm trying to create SwaggerUIBundle where the urls will be of Azure Blob Storage container files. For testing purpose I have hard coded the urls in here like this in my index.jsp file:

      // Begin Swagger UI call region    const ui = SwaggerUIBundle({        urls: [            {url: "https://backendsa.blob.core.windows.net/swagger-consolidation/*****", name: "SwaggerConsolidation"},            {url: "https://backendsa.blob.core.windows.net/swagger-consolidation/*****2", name: "SwaggerConsolidation2"},          ],      dom_id: '#swagger-ui',      deepLinking: true,      spec: location.host,      presets: [        SwaggerUIBundle.presets.apis,        SwaggerUIStandalonePreset      ],      plugins: [        SwaggerUIBundle.plugins.DownloadUrl      ],      layout: "StandaloneLayout"    })    // End Swagger UI call region  

These urls are pointing SAS urls for Azure Blob Storage files and are accessible while hitting in open network. But while I deploy the code it gives below error :

Fetch error  NetworkError when attempting to fetch resource. https://backendsa.blob.core.windows.net/swagger-consolidation/*****  Fetch error  Possible cross-origin (CORS) issue? The URL origin (https://backendsa.blob.core.windows.net) does not match the page (https://router-sc.dev-wus.digitalservices.com). Check the server returns the correct 'Access-Control-Allow-*' headers.     

Any insight over the issue would be helpful.

https://stackoverflow.com/questions/66762710/unable-to-access-azure-blob-sas-uri-in-swaggeruibundle-url-list March 23, 2021 at 07:59PM