Angular 6 对 .NET Web API 的跨域 POST 请求返回 401（未经授权）

Posted 2023-03-04

【中文标题】Angular 6 对 .NET Web API 的跨域 POST 请求返回 401（未经授权）

【英文标题】：Angular 6 cross domain POST request to .NET Web API returns 401 (Unauthorized)

【发布时间】：2018-12-31 11:11:37

【问题描述】：

我有一个Angular 6 应用程序，我正在尝试向我们位于不同本地域的.NET Web API 项目发出POST 请求。

尝试此POST 会向控制台抛出以下错误：POST http://localhost:9090/api/values 401 (Unauthorized)

Web API 正在 localhost:9090 上运行 Angular 正在 localhost:5200 上运行

在 .NET Web API 中，我的 CORS 在 Web.config 中启用：

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

Angular 服务（应该将错误记录到服务器）：

import  Injectable  from '@angular/core';
import  Http, Response, Request, Headers  from '@angular/http';
import  Observable  from 'rxjs';
import  from  from 'rxjs';
import  map, filter, catchError, mergeMap  from 'rxjs/operators';

@Injectable(
  providedIn: 'root'
)
export class ErrorService 

    http: Http;

  constructor(http: Http) 

    this.http = http;
  ;

  postError(argument) 
    let request = new Request(
      method: "POST",
      url: "http://localhost:9090/api/values"
    );

    return this.http.request(request)
      .pipe(map(res => res.json()))
      .subscribe(
        data => console.warn(data),
        err => console.error(err),
        () => console.log("empty")
      );
  

我怀疑我的 Angular 服务 - 也许我没有在我的标头中包含必要的凭据？

最后一点 - 从头开始​​创建一个新的 Web API 项目时，POST 可以工作（我没有尝试使用我的特定服务，但我的队友遇到了相同的 401 问题并创建了一个新的 Web API项目为他工作）。因此，我的 Web API 项目中的某些设置使得我的 Angular 服务不符合 Web API 项目的安全标准（？）。任何提示将不胜感激。

【参考方案1】：

我假设您使用 NTLM 身份验证：

我的第一次尝试是包含请求选项withCredentials，就像here 所述：

let request = new Request( method: "POST", url: "http://localhost:9090/api/values", withCredentials: true);

我还强烈建议使用 HttpClient 而不是 Http 和 Request Classes，因为它们是 deprecated。

【讨论】：

谢谢 Jon Skeet - 我是说 Daniel。这是一个很好的答案 - 就像一个魅力。