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 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.

Either add headers statically in the web.config or dynamically with the cors attribute. Not both. — Wiktor Zychla
– Wiktor Zychla, Commented Apr 8, 2015 at 19:50
sorry, can you explain as i said i am new.... with example? i am even new asking questions on stack overflow — trigri
– trigri, Commented Apr 8, 2015 at 19:56

Abhilash Augustine · Accepted Answer · 2015-11-12 04:33:09Z

51

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.

answered Nov 12, 2015 at 4:33

Abhilash Augustine

4,2081 gold badge26 silver badges25 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Community · Accepted Answer · 2017-05-23 11:47:23Z

4

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

edited May 23, 2017 at 11:47

CommunityBot

11 silver badge

answered Apr 9, 2015 at 21:07

Karen B

3312 silver badges9 bronze badges

Comments

RBT · Accepted Answer · 2019-11-29 06:46:20Z

2

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

edited Nov 29, 2019 at 6:46

RBT

26.3k24 gold badges178 silver badges267 bronze badges

answered Jan 5, 2019 at 10:43

Sivashankar

5641 gold badge9 silver badges17 bronze badges

Comments

Community · Accepted Answer · 2017-05-23 11:47:23Z

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.

Don W. · Accepted Answer · 2018-08-31 14:22:35Z

0

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);

answered Aug 31, 2018 at 14:22

Don W.

5601 gold badge7 silver badges23 bronze badges

Comments

cute-marshmallow · Accepted Answer · 2022-02-25 14:05:24Z

0

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.

answered Feb 25, 2022 at 14:05

cute-marshmallow

711 silver badge6 bronze badges

Collectives™ on Stack Overflow

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

6 Answers 6

Comments

Comments

Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

Comments

Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related