I have requests that are valid when I am making requests from browser , but through the Angular 9 app I get a 401 error. This is the header from chrome:

    Request URL: http://localhost:1234/api/Common/GetMy_List
Request Method: GET
Status Code: 401 
Referrer Policy: strict-origin-when-cross-origin
Access-Control-Allow-Credentials: true
Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept, X-Token
Access-Control-Allow-Methods: GET, POST, PUT, DELETE, OPTIONS
Access-Control-Allow-Origin: http://localhost:4200
Access-Control-Allow-Origin: *
Cache-Control: private
Content-Length: 6069
Content-Type: text/html; charset=utf-8
Date: Wed, 06 Oct 2021 12:55:39 GMT
Server: Microsoft-IIS/10.0
WWW-Authenticate: Negotiate
WWW-Authenticate: NTLM
X-Powered-By: ASP.NET
Accept: application/json, text/plain, */*
Accept-Encoding: gzip, deflate, br
Accept-Language: he-IL,he;q=0.9,en-US;q=0.8,en;q=0.7
Connection: keep-alive
Host: localhost:1234
Origin: http://localhost:4200
Referer: http://localhost:4200/
sec-ch-ua: "Chromium";v="94", "Google Chrome";v="94", ";Not A Brand";v="99"
sec-ch-ua-mobile: ?0
sec-ch-ua-platform: "Windows"
Sec-Fetch-Dest: empty
Sec-Fetch-Mode: cors
Sec-Fetch-Site: same-site
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/94.0.4606.71 Safari/537.36

I have an angular 9 project with proxy.conf.json file that declared in package.json. the file contain this lines:

{
  "/api/*": {
    "target": "http://localhost:1234",
    "secure": true,
    "logLevel": "debug",
    "changeOrigin": true
  }
}

In server side there is an asp.net api with this lines in global.asax:

 public void Application_BeginRequest(object sender, EventArgs e)
        {
            string httpOrigin = Request.Params["HTTP_ORIGIN"];
            if (httpOrigin == null) httpOrigin = "*";
            HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", httpOrigin);
            HttpContext.Current.Response.AddHeader("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS");
            HttpContext.Current.Response.AddHeader("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept, X-Token");
            HttpContext.Current.Response.AddHeader("Access-Control-Allow-Credentials", "true");
            if (Request.HttpMethod == "OPTIONS")
            {
                HttpContext.Current.Response.StatusCode = 200;
                var httpApplication = sender as HttpApplication;
                httpApplication.CompleteRequest();
            }
        }

In the web.config:

  <system.webServer>
     <httpProtocol>
        <customHeaders>
          <add name="Access-Control-Allow-Origin" value="*" />
        </customHeaders>
      </httpProtocol>
    <validation validateIntegratedModeConfiguration="false" />  
    <directoryBrowse enabled="false" />  
  </system.webServer>
 <system.serviceModel>
    <behaviors>
      <endpointBehaviors>
        <behavior name="ImpersonateBehaviour">
          <clientCredentials>
            <windows allowedImpersonationLevel="Delegation" />
          </clientCredentials>
        </behavior>
      </endpointBehaviors>
    </behaviors>
    <bindings>
      <basicHttpBinding>
        <binding name="BasicHttpBinding_IService1" maxReceivedMessageSize="2147483647">
          <security mode="TransportCredentialOnly">
            <transport clientCredentialType="Windows" />
          </security>
        </binding>
      </basicHttpBinding>
    </bindings>
    <client>
      <endpoint address="http://localhost/xxx.svc" behaviorConfiguration="ImpersonateBehaviour" binding="basicHttpBinding" bindingConfiguration="BasicHttpBinding_IService1" contract="Service1Ref.IService1" name="BasicHttpBinding_IService1" />
    </client>
  </system.serviceModel>

CodePudding user response：

Just a quick one but its not CORS problem,

401 Unauthorized The HyperText Transfer Protocol (HTTP) 401 Unauthorized client error status response code indicates that the client request has not been completed because it lacks valid authentication credentials for the requested resource.

maybe you should look in this direction, also in the google chrome network tab when you have a CORS error, its writhen in-text CORS ERROR

CodePudding user response：

Browser allows any http request to the origin ( url where your http session started ). In single page applications we usually load the DOM which intern makes additional XHRs to a new domain (usually a new web app/rest api) . This is considered as a security flaw and all of the reputable and modern browsers stopped supporting this behavior.

To mitigate this you need a proxy in origin domain. All of the request to get data should pass through it.

In angular you can :

1. Configure the server to send the appropriate CORS headers
2. Configure Angular CLI proxy

I suggest using angular CLI proxy rather than adding CORS configuration.