Original Article: https://www.c-sharpcorner.com/article/enable-windows-authentication-in-web-api-and-angular-app/

Re-posted in case site goes away

Other resource: https://www.npmjs.com/package/activedirectory




In this article, we will learn about how to use inbuilt Windows authentication in Web API and Angular application for authentication and authorization purposes.


We have a requirement for in-house project development in the Angular App using Web API. As the purpose of this application is to use inside office only,  so it’s suggested to use Windows Authentication mode.


To access any web API from Angular or any Ajax method Web API must be CORS (Cross Origin Resource Sharing) enabled otherwise the request is not executed.

You can achieve this by referring to the below links.

Step 1

Create Web API Project and in Web.config select Authentication mode as “Windows”,

Enable Windows Authentication in Web API and Angular App


Web Config Code snippet

  1. <system.web>
  2.     <authentication mode=“Windows” ></authentication>
  3. </system.web>

Or you can publish web API project in IIS and Enable Windows Authentication from there.

Enable Windows Authentication in Web API and Angular App


So, based on the above screenshot you can enable Windows authentication for Web API Project.

Step 2

Use Authorize attribute on the controller or on any action method for security.

Enable Windows Authentication in Web API and Angular App


Code snippet for WebAPI Controller

  1. [EnableCors(origins: “*”, headers: “*”, methods: “*”, SupportsCredentials = true)]
  2.     public partial class WebAPIController : ApiController
  3.     {
  4.         /// <summary>
  5.         /// This method contains Authorize attribute for authentication and authroization
  6.         /// </summary>
  7.         /// <returns></returns>
  8.         [HttpGet]
  9.         [Authorize]
  10.         [Route(“api/AuthenticateUser”)]
  11.         public HttpResponseMessage AuthenticateUser()
  12.         {
  13.             if (User != null)
  14.             {
  15.                  return Request.CreateResponse(HttpStatusCode.OK, new
  16.                 {
  17.                     status = (int)HttpStatusCode.OK,
  18.                     isAuthenticated = true,
  19.                     isLibraryAdmin = User.IsInRole(@“domain\AdminGroup”),
  20.                     username = User.Identity.Name.Substring(User.Identity.Name.LastIndexOf(@“\”) + 1)
  21.                 });
  22.             }
  23.             else
  24.             {
  25. //This code never execute as we have used Authorize attribute on action method
  26.                 return Request.CreateResponse(HttpStatusCode.OK, new
  27.                 {
  28.                     status = (int)HttpStatusCode.BadRequest,
  29.                     isAuthenticated = false,
  30.                     isLibraryAdmin = false,
  31.                     username = “”
  32.                 });
  33.             }
  34.          }
  35.     }

As per the above screenshot, I have added [Authorize] attribute in AuthenticateUser Action method. This attribute makes sure that action is only executed if the user entered a valid credential otherwise it will display 401 Unauthorized access.

Here, I have added [Authorize] attribute only to action method. This can be put at Controller level as well and if the application has multiple Roles then it can be extended by passing Role name along with Authorize Attribute. You can explore more from WebAPI Authorization

While testing WebAPI from localhost (With Visual Studio by hitting F5 or Ctrl + F5) I am always getting this error {“Message”:”Authorization has been denied for this request.“}. However, if I publish this same website in IIS then I am getting a valid response as below with no extra work required.


Here, username (admin it can be any user) is logged in user in windows system (or Virtual Machine).

Stack Overflow Question – https://stackoverflow.com/questions/24194941/windows-authentication-not-working-in-iis-express-debugging-with-visual-studio

When we run or debug the application from Visual Studio it is not hosted in IIS, instead it hosts in IISExpress which is part of the Visual Studio and stores the minimum required configuration or default configuration to run any application.

So, based on the provided solution from above Stack overflow question I have enabled windows authentication (<windowsAuthentication enabled=”true”>) in “applicationhost.config” file which resides at Project root directory “.vs\config”, this folder is hidden you must enable the show all hidden files and folder option.

Enable Windows Authentication in Web API and Angular App


By Default, Windows authentication value is false in  “applicationhost.config”

Now, we have successfully enabled Windows authentication in WebAPI Project.

Step 3

As per the prerequisite enable CORS at controller level along with SupportCredentials true,

Enable Windows Authentication in Web API and Angular App


As per screenshot, enable CORS with the provided configuration. Here Instead of “*“(Allow from any origin), you can restrict with specific IP Address or domain name.

Step 4

CORS is enabled from the server side. Now while requesting API, pass flag withCredentials: true from the frontend.

For jQuery Ajax you must pass the request as below.

  1. $.ajax({url:apiURL ,xhrFields: {   withCredentials: true }, success:successHandler });


For Angular you must pass the request as below.

  1. private options = new RequestOptions({ withCredentials: true });
  2. this.http.get(this.baseUrl, this.options)

Code Snippet

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js”&gt;
  5. $(document).ready(function(){
  6.     $(“button”).click(function(){
  7.     // IIS localhost but with host domain name, with support credential true in Enable CORS
  8.      //var apiURL=”http://libraryapi.com/api/authenticateuser&#8221;;
  9.     // IIS Localhost with support credential true in Enable CORS
  10.     //var apiURL=”http://localhost:3005/api/AuthenticateUser&#8221;;
  11.     //IIS Express with support credential true in Enable CORS
  12.     var apiURL=http://localhost:51647/api/AuthenticateUser&#8221;;
  13.         $.ajax({url:apiURL ,xhrFields: {
  14.                         withCredentials: true
  15.                     }, success: function(result){
  16.                     console.log(JSON.stringify(result));
  17.                     document.write(JSON.stringify(result));
  18.             $(“#div1”).html(JSON.stringify(result));
  19.         }});
  20.     });
  21. });
  22. </head>
  23. <body>
  24. “div1”>

    Let jQuery AJAX to Access Web API Response with Windows Authentication

  25. <button> Click Me to Get Web API Response</button>
  26. </body>
  27. </html>

Now, we have successfully consumed Windows Enabled Authenticated WebAPI .

In case of accessing WebAPI, the dialog for login and password prompts infinitely for the correct password. Then you need to disable the loopback check by executing PowerShell command

New-ItemProperty HKLM:\System\CurrentControlSet\Control\Lsa -Name “DisableLoopbackCheck” -value “1” -PropertyType dword

Reference link


In this article, we learned about how to enable Windows Authentication in Web API and Consume Secure web API from jQuery Ajax and Angular App.