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

Issue

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.

Solution

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 By – Abhilash Augustine

Answer Checked By – Robin (BugsFixing Admin)

Leave a Reply

Your email address will not be published. Required fields are marked *