Azure Staging Environment "No 'Access-Control-Allow-Origin' header is present on the-CodePudding

I've inherited a web-app hosted in Azure and it appears the staging environment CORS is not functioning like all other environments.

I'm fairly new to Azure administration and I've applied the CORS configuration on the API app service (previously had no config set) which did not resolve the issue.

You can compare the different environment general/response headers below.

Local Dev...

Request URL: http://localhost:3001/api/getstarted/plans?fetchExcluded=true
Request Method: GET
Status Code: 200 OK
Remote Address: [::1]:3001
Referrer Policy: strict-origin-when-cross-origin
Access-Control-Allow-Origin: *
Connection: keep-alive
Content-Encoding: gzip
Content-Type: application/json; charset=utf-8
Date: Thu, 04 Nov 2021 21:55:22 GMT
Keep-Alive: timeout=5
Strict-Transport-Security: max-age=15552000; includeSubDomains
Transfer-Encoding: chunked
Vary: Accept-Encoding
X-Content-Type-Options: nosniff
X-DNS-Prefetch-Control: off
X-Download-Options: noopen
X-Frame-Options: SAMEORIGIN
X-XSS-Protection: 1; mode=block

Current Production...

Request URL: https://api.<webapp>.app/api/getstarted/plans?fetchExcluded=true
Request Method: OPTIONS
Status Code: 204 No Content
Remote Address: ##.###.###.###:443
Referrer Policy: strict-origin-when-cross-origin
Access-Control-Allow-Headers: authorization
Access-Control-Allow-Methods: GET,HEAD,PUT,PATCH,POST,DELETE
Access-Control-Allow-Origin: *
Date: Thu, 04 Nov 2021 22:04:19 GMT
Strict-Transport-Security: max-age=15552000; includeSubDomains
Vary: Access-Control-Request-Headers
X-Content-Type-Options: nosniff
X-DNS-Prefetch-Control: off
X-Download-Options: noopen
X-Frame-Options: SAMEORIGIN
X-XSS-Protection: 1; mode=block

However in staging...

Request URL: https://<webapp>.azurewebsites.net/api/getstarted/plans?fetchExcluded=true
Request Method: OPTIONS
Status Code: 503 Service Temporarily Unavailable
Remote Address: ##.###.###.###:443
Referrer Policy: strict-origin-when-cross-origin
Content-Length: 398
Date: Thu, 04 Nov 2021 21:56:02 GMT
Server: nginx

and from debug console in staging...


 - Access to XMLHttpRequest at
   'https://<webapp>.azurewebsites.net/api/getstarted/plans?fetchExcluded=true'
   from origin 'https://<webapp>.z8.web.core.windows.net' has been
   blocked by CORS policy: Response to preflight request doesn't pass
   access control check: No 'Access-Control-Allow-Origin' header is
   present on the requested resource. xhr.js:178  
 - GET
   https://<webapp>-api-staging.azurewebsites.net/api/getstarted/plans?fetchExcluded=true
   net::ERR_FAILED

I've checked the Azure Subscription usage quotas, and the only thing nearing quota is "Network Watchers"

The API framework is ExpressJS with CORS...

app.use(cors())

CodePudding user response：

In my opinion the issue has nothing to do with CORS, well, better said,...

As you can see in the staging environment you are receiving a 503, service unavailable, HTTP status error code:

Status Code: 503 Service Temporarily Unavailable

So my guess is that the staging environment is not working properly by some reason, and the associated load balancer is returning a 503 error page, of course, without any CORS indication, and your browser is complaining due to the fact your API doesn't receive a valid response.

Please, review the status of the staging environment: once healthy, it probably will offer a proper response to your application.

CodePudding user response：

Unfortunately the issue was not CORS at all; rather the server image was failing to build and compile due to ESNext JS syntax (server < ESNext)

I found the logstream API which allowed me to view all errors, for posterity you might be able to find the same; https://<webapp>.scm.azurewebsites.net/api/logstream