swagger-ui: Valid response returning "TypeError: Failed to fetch"
As requested, please see below a new issue I am having;
I’ve just grabbed master (3.0.19) and am having this exact same issue, see my Stackoverflow post here: https://stackoverflow.com/questions/45156665/swagger-ui-typeerror-failed-to-fetch-on-valid-response
In a nutshell, I’ve simply upgraded to 3.0.19 then forced a 403 error, instead of getting a 403 - forbidden, it’s returning “TypeError: Failed to fetch”.
Previous version: * @version v2.2.6
Below is my definition snippet
"host": "uk-test-api.services",
"schemes": ["https"],`
/api/v1/cards": {
"get": {
"tags": ["Cards"],
"summary": "Getsalistofcardsforafirm.",
"operationId": "Card_GetCards",
"produces": ["application/json"],
"parameters": [{
"name": "includes",
"in": "query",
"description": "Extracardproperties",
"required": false,
"type": "string"
},
{
"name": "lastRowVer",
"in": "query",
"description": "lastRowVerofpreviousrequest",
"required": false,
"type": "string"
},
{
"name": "Authorization",
"in": "header",
"description": "AuthToken",
"required": true,
"type": "string"
}],
"responses": {
"200": {
"description": "200response",
"schema": {
"$ref": "#/definitions/CardListJson"
},
"headers": {
"Access-Control-Allow-Origin": {
"type": "string"
}
}
},
"400": {
"description": "BadRequest",
"headers": {
"Access-Control-Allow-Origin": {
"type": "string"
}
}
},
"401": {
"description": "Unauthorized",
"headers": {
"Access-Control-Allow-Origin": {
"type": "string"
}
}
},
"403": {
"description": "Forbidden",
"headers": {
"Access-Control-Allow-Origin": {
"type": "string"
}
}
},
"404": {
"description": "NotFound",
"headers": {
"Access-Control-Allow-Origin": {
"type": "string"
}
}
},
"429": {
"description": "TooManyRequests",
"headers": {
"Access-Control-Allow-Origin": {
"type": "string"
}
}
},
"500": {
"description": "InternalServerError",
"headers": {
"Access-Control-Allow-Origin": {
"type": "string"
}
}
},
"504": {
"description": "504GatewayTimeout",
"headers": {
"Access-Control-Allow-Origin": {
"type": "string"
}
}
}
}
Swagger page currently with the issue: https://api-swagger-uk-test.leap.services/#/

The URL is HTTPS: https://uk-test-api.leap.services/api/v1/cards
PS - I’ve since tested with a 401 response and get the same issue:

And a 400 is working as expected:

About this issue
- Original URL
- State: closed
- Created 7 years ago
- Comments: 15 (7 by maintainers)
FYI this error can also happen if the user selects an HTTPS scheme and on their local development environment has a self signed SSL certificate. In this case adding -K to the curl command will fix the error or also just selecting the HTTP scheme should be sufficient.
Hi @ShaneGMamet,
I see this error from the Fetch API in the JS console:
I see the browser is doing an OPTIONS pre-fetch which returns the correct
Access-Control-Allow-Originheader, however the actual GET request that returns the 401 does not return theAccess-Control-Allow-Originheader. Are you able to update your backend to return that header for 401 (or all error responses) and try testing this again?because of cross origin its happening I am sure you will solve by your own
visit for node : https://www.npmjs.com/package/cors
@shockey and @owenconti
Thanks for the feedback, your responses led me to figure out what the issue is, and it’s actually an AWS bug with the API Gateway Custom Authorizers.
For anyone with this issue that is using AWS API Gateway’s custom authorizers, see this AWS thread - this has been an issue for over a year already:
How to setup response headers for a custom authorizer
In a nutshell - AWS API Gateway custom authorizers do not support returning headers (at all), hence, the issue of it not displaying correctly within the Swagger page.
Until AWS make changes to their Authorizers, we cannot test this - please feel free to close this for now. I’ll update this again once the fix has been made.