CORS policy "Access-Control-Allow-Origin" IIS

Question

I have angular , Entity Framework and MS SQL server. I need to have Backend set on MS IIS because I need to have domain authentication. Unluckily I still get problems with CORS.

When I have in my web.config file:

<httpProtocol>
        <customHeaders>
            <add name="Access-Control-Allow-Origin" value="http://localhost" />
            <add name="Access-Control-Allow-Methods" value="GET,PUT,POST,DELETE,OPTIONS" />
            <add name="Access-Control-Allow-Headers" value="Content-Type" />
        </customHeaders>
      </httpProtocol>

I get in the browser: "has been blocked by CORS policy: The 'Access-Control-Allow-Origin' header has a value ' http://localhost ' that is not equal to the supplied origin"

When I change it to:

<httpProtocol>
        <customHeaders>
            <add name="Access-Control-Allow-Origin" value="*" />
            <add name="Access-Control-Allow-Methods" value="GET,PUT,POST,DELETE,OPTIONS" />
            <add name="Access-Control-Allow-Headers" value="Content-Type" />
        </customHeaders>
      </httpProtocol>

I get: "has been blocked by CORS policy: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute."

Any idea what should I change?

Next changes:

<httpProtocol>
        <customHeaders>
            <add name="Access-Control-Allow-Origin" value="" />
            <add name="Access-Control-Allow-Credentials" value="true" />
            <add name="Access-Control-Allow-Methods" value="GET,PUT,POST,DELETE,OPTIONS" />
            <add name="Access-Control-Allow-Headers" value="Content-Type" />
        </customHeaders>
      </httpProtocol>

Error in browser: "has been blocked by CORS policy: The 'Access-Control-Allow-Origin' header contains the invalid value 'true'."

In fiddler I can see: Security Access-Control-Allow-Origin: true

It looks like the values are not being added to given headers.

Next change: I installed CORS module for IIS and the file looks like:

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <system.webServer>
        <cors enabled="true" failUnlistedOrigins="true">
            <add origin="http://localhost:4200"
                 allowCredentials="true"
                 maxAge="120"> 
                <allowHeaders allowAllRequestedHeaders="true">
                    <add header="header1" />
                </allowHeaders>
                <allowMethods>
                     <add method="GET, POST" />
                </allowMethods>
            </add>
        </cors>
    </system.webServer>
</configuration>

The answer in browser now is: "HTTP Error 404.0 - Not Found The resource you are looking for has been removed, had its name changed, or is temporarily unavailable. " Is it better now? What could be next steps?

Answer 1

If your localhost server is running on a specific port, it must be included in the Access-Control-Allow-Origin , such as http://localhost:8080 .

In the browser Developer Tools > Network check the Request headers and verify the Referer . This is the URL that should be set for Access-Control-Allow-Origin .

Developer Tools > Network

Configuration

<add name="Access-Control-Allow-Origin" value="http://localhost:8080" />

---

In addition, you may need to set Access-Control-Allow-Credentials .

<add name="Access-Control-Allow-Credentials" value="true" />