CODEWITHSUNDEEP
asp.netangularjsasp.net-web-apicors
trigri
trigri

Reputation: 565

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

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 is the error:

XMLHttpRequest cannot load http://localhost:41028/api/values/abc. The 'Access-Control-Allow-Origin' header contains multiple values '*, *', but only one is allowed. Origin 'http://localhost:44796' is therefore not allowed access.

This is the code I added in the web.config file:

<system.webServer>
...
<httpProtocol>
  <customHeaders>
      <!-- Adding the following custom HttpHeader will help prevent CORS errors -->
      <add name="Access-Control-Allow-Origin" value="*" />
      <add name="Access-Control-Allow-Headers" value="Content-Type" />
  </customHeaders>
</httpProtocol>
...
</system.webServer>

In the WebApiConfigFile.cs file I added:

var CorsAttribute = new EnableCorsAttribute("* ","* ", "* ");
        config.EnableCors(CorsAttribute);

I'm using CORS for the first time. Any help will be appreciated.

Upvotes: 34

Views: 88280

Answers (6)

cute-marshmallow
cute-marshmallow

Reputation: 71

I had the exact same error and the reason was that

"Access-Control-Allow-Origin: *"

header was already present in the IIS HTTP Response Headers list. Example

Removing it from the list worked for me.

Upvotes: 0

Sivashankar
Sivashankar

Reputation: 564

All other solutions provided for webAPI. This solution is for when you using webservice(.asmx) as API

Remove 'Access-Control-Allow-Origin' details from either in Global.asax.cs file's begin_request function or in web.config. Because this setting must be in one place only

Upvotes: 2

Don W.
Don W.

Reputation: 560

I had the same issue. After I put the exact domain instead of * (see below), it worked for me.

var CorsAttribute = new EnableCorsAttribute("https://www.mywebsite.com","", ""); config.EnableCors(CorsAttribute);

Upvotes: 0

dichen
dichen

Reputation: 1633

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.

Upvotes: 0

Abhilash Augustine
Abhilash Augustine

Reputation: 4208

You are setting CORS twice. I think that is the issue.

Please remove any one CORS settings. You can either remove it from web.config or from WebApiConfigFile.cs.

Upvotes: 51

Karen B
Karen B

Reputation: 331

Chrome and Firefox use what is called a pre-flight check using the "OPTIONS" verb.

So, you have to add "OPTIONS" to the allowed methods in the web.config. You also may have to add some code to the Application_Begin request, like this answer suggests: Handling CORS Preflight requests to ASP.NET MVC actions

Here are some resources for CORS:

IIS hijacks CORS Preflight OPTIONS request

http://www.asp.net/web-api/overview/security/enabling-cross-origin-requests-in-web-api

Upvotes: 4

Related Questions