Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Swagger UI - " TypeError: Failed to fetch" on valid response

I've just pulled down the latest Swagger from the Git repo (3.0.19) using: https://github.com/swagger-api/swagger-ui.git and updated my API to use the new version.

Ran git describe --tags to confirm and my version is currently: v3.0.19-6-gaab1403

The problem I'm having is one described here, whereby my response is a 403 (I can see this in the inspector on the browser) and although I have a reponse for error 403, I still get the TypeError: Failed to fetch message.

enter image description here

enter image description here

Here's a snippet from my definition regarding the 403 response:

                    "403": {                     "description": "Forbidden",                     "headers": {                         "Access-Control-Allow-Origin": {                             "type": "string"                         }                     }                 }, 

I've also noticed it reported here however, I know it's not a CORS issue as I have tested the endpoints and the OPTIONS are returning correct, as are the endpoints if called with valid information (I force this 403).

Could anyone point me in the right direction please?

Update: I have since tested on a 401 response, with the same response.

enter image description here

And that a 400 is working as expected:

enter image description here

like image 821
Hexie Avatar asked Jul 18 '17 02:07

Hexie


2 Answers

For anyone that runs into this problem;

After a day of troubleshooting and the Swagger support guys pointing me in the right direction, it turns out that this is currently caused by a bug within the AWS API Gateway custom authorizers.

We are currently using AWS API Gateway for managing our APIs, this includes managing all our authorization via a custom authorizer. The issue is that custom authorizers do not currently support passing through headers within the response and Swagger UI needs the Access-Control-Allow-Origin:* within the response header(s) to display the correct HTTP status code.

See this AWS thread regarding the issue (which is older than a year already):

https://forums.aws.amazon.com/thread.jspa?messageID=728839

Swagger UI discussion on same: https://github.com/swagger-api/swagger-ui/issues/3403

EDIT / UPDATE

This has since been resolved with the use of Gateway Responses. See this same forum (page 2):

https://forums.aws.amazon.com/thread.jspa?messageID=728839

like image 94
Hexie Avatar answered Sep 17 '22 19:09

Hexie


I hit this error during local development (i.e., had nothing to do with AWS). The underlying cause (CORS violation) is identical. The following might help others who encounter this problem.

I setup connexion with an openapi spec that referred to http://localhost:9090/. When the development server starts, it says "Running on http://0.0.0.0:9090/". That page appears to work, but the swagger ui uses http://localhost:9090/ from the openapi spec for subsequent requests and shows TypeError: Failed to fetch in results. The browser console shows Access to fetch at 'http://localhost:9090/vr/variation' from origin 'http://0.0.0.0:9090'. The provided curl command worked fine; although initially confusing, the curl success is a clue that the problem is due to browser blocking rather than server-side failure.

(Connexion is based on Python flask and provides extended support for openapi integration.)

like image 33
Reece Avatar answered Sep 19 '22 19:09

Reece