Angular端配置Windows身份验证：内网.NET Core应用免密登录方案

我之前在类似的内网域环境项目里折腾过这个配置，刚好可以给你梳理下Angular端的核心步骤，重点是让应用自动识别域用户并正确传递凭据到后端：

1. 全局配置HTTP请求自动携带凭据 #

Windows身份验证依赖NTLM/Kerberos协议，这要求Angular的每个HTTP请求都带上withCredentials: true参数，不然浏览器不会自动传递当前域用户的凭据。

最省心的方式是写一个HTTP拦截器，全局给所有请求加上这个配置：

// src/app/core/interceptors/auth.interceptor.ts
import { Injectable } from '@angular/core';
import { HttpRequest, HttpHandler, HttpEvent, HttpInterceptor } from '@angular/common/http';
import { Observable } from 'rxjs';

@Injectable()
export class AuthInterceptor implements HttpInterceptor {
  intercept(request: HttpRequest<unknown>, next: HttpHandler): Observable<HttpEvent<unknown>> {
    // 克隆请求并添加凭据配置
    const authReq = request.clone({
      withCredentials: true
    });
    return next.handle(authReq);
  }
}

然后在app.module.ts里注册这个拦截器：

import { HTTP_INTERCEPTORS } from '@angular/common/http';
import { AuthInterceptor } from './core/interceptors/auth.interceptor';

@NgModule({
  providers: [
    {
      provide: HTTP_INTERCEPTORS,
      useClass: AuthInterceptor,
      multi: true
    }
  ]
})
export class AppModule { }

2. 获取当前域用户ID #

你需要后端提供一个无需额外认证的接口（因为Windows身份验证已经自动处理了），比如/api/auth/current-user，这个接口会返回当前登录的域用户ID（比如AD的samAccountName）。

Angular端可以写一个用户服务来调用这个接口，把用户信息存在全局状态里：

// src/app/core/services/user.service.ts
import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { BehaviorSubject, Observable } from 'rxjs';
import { tap } from 'rxjs/operators';

interface CurrentUser {
  userId: string;
  // 可按需添加其他字段，比如用户名、AD组等
}

@Injectable({ providedIn: 'root' })
export class UserService {
  private currentUserSubject = new BehaviorSubject<CurrentUser | null>(null);
  public currentUser$ = this.currentUserSubject.asObservable();

  constructor(private http: HttpClient) {}

  loadCurrentUser(): Observable<CurrentUser> {
    return this.http.get<CurrentUser>('/api/auth/current-user').pipe(
      tap(user => {
        this.currentUserSubject.next(user);
      })
    );
  }
}

然后在app.component.ts的初始化逻辑里调用这个方法，确保应用启动时就拿到用户信息：

// src/app/app.component.ts
import { Component, OnInit } from '@angular/core';
import { UserService } from './core/services/user.service';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html'
})
export class AppComponent implements OnInit {
  constructor(private userService: UserService) {}

  ngOnInit(): void {
    this.userService.loadCurrentUser().subscribe();
  }
}

3. 处理前后端跨域（如果需要） #

如果你的Angular开发服务器和后端API不在同一端口/域名，得配置代理或者后端允许跨域：

方式1：Angular代理配置 #

创建proxy.conf.json文件：

{
  "/api": {
    "target": "http://your-backend-api-url",
    "secure": false,
    "changeOrigin": true,
    "withCredentials": true
  }
}

然后在angular.json里指定代理配置：

"architect": {
  "serve": {
    "options": {
      "proxyConfig": "proxy.conf.json"
    }
  }
}

4. 关键注意事项 #

• 浏览器可信站点：把你的应用地址加入IE/Edge的可信站点列表，不然浏览器可能会阻止自动传递凭据（尤其是内网常用的IE浏览器）。
• 协议协商：如果域环境支持Kerberos，性能会比NTLM更好，但Angular端的配置不需要改动，浏览器会自动协商使用合适的协议。
• 禁用匿名访问：确保后端所有需要认证的API接口都禁用匿名访问，不然Windows身份验证流程不会触发。

这样配置后，已登录域的用户访问你的Angular应用时，浏览器会自动传递域凭据，后端API拿到用户ID后就能查询AD组完成授权了。

内容的提问来源于stack exchange，提问作者avsln