Swagger-ui: XMLHttpRequest cannot load. Response for preflight has invalid HTTP status code 404

[deepumi]

Hi,

I have enabled CORS support in Asp.net Web API, And other API test tools like (Fiddler,Postman) could able to get the API result. However, I have tried Swagger-UI (latest version) and I am getting following error.
Both API and API Explorer Swagger are hosted as different sites.

How do I enable CORS in Swagger UI client side?

Note : I get error only when I use authentication, otherwise everything works fine.

Web server site structure

---Root site
--- API Site (actual api)
--- API Explorer (swagger ui)

XMLHttpRequest cannot load. Response for preflight has invalid HTTP status code 404
XHR failed loading: GET

Authorization via Header (Bearer)

      function addApiKeyAuthorization() {
            var key = encodeURIComponent($('#input_apiKey')[0].value);
            if (key && key.trim() != "") {
                var apiKeyAuth = new SwaggerClient.ApiKeyAuthorization("Authorization", "Bearer " + key, "header");
                window.swaggerUi.api.clientAuthorizations.add("key", apiKeyAuth);
                log("added key " + key);
            }
        }

[fehguy]

CORS is a server consideration, not client (i.e. the Swagger-UI hosting). So you'll need to enable CORS on the server that you're calling.

Please see this explanation of CORS:

http://restlet.com/blog/2015/12/15/understanding-and-using-cors/

Note, Postman is a chrome plugin that "gets around" CORS. If you have it, and use it solely, you won't have an issue. Your end users will, if they're trying to call the API with any javascript-enabled client.

CORS is a constraint on Javascript in the browser, not the swagger-ui library. We have literally no control over CORS.

[deepumi]

Thanks @fehguy. Tried enabling CORS server side following this article (http://enable-cors.org/server_aspnet.html) but no luck. Will do some more research and close the issue.

[deepumi]

I have figured out what was causing the issue from server side Asp.Net Web API.

1. Remove any CORS settings from web.config
2. Add following snippet under Register method in WebApiConfig class
   config.EnableCors(new EnableCorsAttribute(origins: "*",headers: "*",methods: "*"));
3. Since I am using Bearer token Authorization, I have to enable SupportsCredentials in the class attribute
   [EnableCors(origins: "*", headers: "*", methods: "*", SupportsCredentials = true)]