Ask a Question

CORS error when trying to access a protected resource

SOLVED
mfj
New Contributor

CORS error when trying to access a protected resource

I use a docker container to run swagger-ui.  Upon customizing the 

SWAGGER_JSON_URL

to my the server running the API (FYI: I am using dependency-track) I am able to retrieve the swagger.json and after authorizing with an x-api-key, if I try to access an API that does not require authentication the CORS headers (access-control-allowed=*) are setup correctly and everything works.

When I try an API that requires authentication, then the browser will do a prefetch OPTIONS with has all of the correct headers.  However, the browser will block with API call with the following error:

 

from origin 'localhost' has been blocked by CORS policy: Cannot parse the Access-Control-Allow-Methods response header field in preflight response.

 

The allow methods header in the preflight are valid.

 

I tried to start the container with the WITH_CREDENTIALS environment variable and I get the same error.  I get the same error when I try to run swagger-ui using the standalone method modifying the dist/swagger-initializer.js to point to the correct url.  I think that something needs to be configured in swagger-ui so that the call to the protected API goes through.  I cannot blame the API server because it does not even receive the API call (just the prefetch) as the browser blocks it.

 

This happens with Version 109.0.5414.75 (Official Build) (64-bit) of chrome and version Version 108.0.1462.54 (Official build) (64-bit) of Microsoft Edge.  Those two are very recent version of their respective browsers.

1 REPLY 1
mfj
New Contributor

I found out the problem.  The Access-Control-Allow-Methods returned from the API server prefetch request used spaces instead of comma to separate the methods...Argggg.  After correcting everything is working fine.

cancel
Showing results for 
Search instead for 
Did you mean: