The 'Access-Control-Allow-Origin' header contains multiple values '*, *', but only one is allowed

Question

I\'m using Angular and ASP.NET API. The issue I\'m facing: when I add CORS in the API code, it works on Internet Explorer but does not work on Chrome and Firefox.

Here i

Answer 1

I got this issue because I put the app.UseCors after ConfigureOAuth. Change the order fix the problem.

    public void Configuration(IAppBuilder app)
    {
        HttpConfiguration config = new HttpConfiguration();

        app.UseCors(Microsoft.Owin.Cors.CorsOptions.AllowAll);
        ConfigureOAuth(app);

        WebApiConfig.Register(config);

        // Used to put this line after ConfigureAuth(app), 
        // app.UseCors(Microsoft.Owin.Cors.CorsOptions.AllowAll);

        app.UseWebApi(config);
    }

Here is the detail in my case:

• At the beginning I got Origin is not allowed in 'Access-Control-Allow-Origin', when calling \token.
• LSo I add the customHeader including 'Access-Control-Allow-Origin', 'Access-Control-Allow-headers', 'Access-Control-Allow-methods'. It fixed the \token request.
• But then I got duplicate 'Access-Control-Allow-Origin' when calling detail api. There are a lot suggestions, such as this just couldn't fix.