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:

@shockey @webron

[bitclaw]

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.

[owenconti]

Hi @ShaneGMamet,

I see this error from the Fetch API in the JS console:

Fetch API cannot load https://uk-test-api.leap.services/api/v1/cards. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://api-swagger-uk-test.leap.services' is therefore not allowed access. The response had HTTP status code 401. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

I see the browser is doing an OPTIONS pre-fetch which returns the correct Access-Control-Allow-Origin header, however the actual GET request that returns the 401 does not return the Access-Control-Allow-Origin header. Are you able to update your backend to return that header for 401 (or all error responses) and try testing this again?