Angular POST 请求的 header 为空

Question

我正在开发 Ionic 3 移动应用程序，Angular 的 POST 方法有问题。

在登录页面中，我创建了一个表单并尝试使用 Angular HTTP POST 方法将数据发送到服务器。但是在服务器（.NET WEB API）中我看到请求的 header 是空的。

这里是Angular边码；

  login(username, password):Observable<Object>{

    let url : string = this.apiUrl+"/login";
    let headers = new HttpHeaders();

    headers.append('Authorization', btoa(username+":"+password).toString());

    return this.http.post(url,JSON.stringify({username,password}), {headers: headers});
  }

这是控制器的 .NET 端代码；

[EnableCors(origins: "http://localhost:8100", headers: "*", methods: "*")]
public Response Post()
{
    return _mobileUserService.Login();
}

这是捕获请求的 .NET 端代码部分；

protected override Task<HttpResponseMessage> SendAsync(HttpRequestMessage request, CancellationToken cancellationToken)
        {
            try
            {
                var token = request.Headers.GetValues("Authorization").FirstOrDefault();
            }

            catch (Exception ex)
            {

            }

            return base.SendAsync(request, cancellationToken);
        }

当 .NET 捕获请求时（在运行中），我看到 "request" 变量的这些值；

request = {Method: POST, RequestUri: 'http://localhost:41582/api/login', Version: 1.1, Content: System.Web.Http.WebHost.HttpControllerHandler+LazyStreamContent, Headers:
{
  Connection: keep-alive
  Accept: application/json
  Accept: text/plain
  Accept: */*
  ...

通常情况下，请求的 url 是 localhost:8100，所以我认为服务器接受了 CORS

我该如何解决？

Answer 1

在 Web api 中，您必须区分哪种方法 post 或根据您设置路线的方式获取。

[EnableCors(origins: "http://localhost:8100", headers: "*", methods: "*")]
[HttpPost] // Decorate post this attribute in your controller
public Response Post()
{
    return _mobileUserService.Login();
}

Angular POST 请求的 header 为空

Angular POST request's header is null

asp.net-web-api

angular-http

ionic3