Asp.net Core 2.0与Angular5 HttpClient Post请求：WebAPI中Broker对象为null

嘿，我帮你梳理下这个问题的常见原因和解决办法，我之前也遇到过类似的情况，一步步来排查：

1. 务必给WebAPI控制器参数加上[FromBody]标记 #

WebAPI对于复杂类型（比如你的Broker对象），默认不会自动从请求体里读取数据，必须显式标注[FromBody]，否则它会尝试从URL查询参数里绑定，自然拿不到值。示例代码：

[HttpPost]
public IActionResult Create([FromBody] Broker broker)
{
    // 这里就能正常获取broker对象了（前提是其他配置正确）
    if (broker == null)
    {
        return BadRequest("Broker data is missing");
    }
    // 你的业务逻辑...
    return Ok();
}

2. 确保Angular请求头正确设置Content-Type #

Angular的HttpClient在发送JSON数据时，需要明确设置请求头为application/json，否则WebAPI可能无法正确解析请求体。同时要确保把对象序列化为JSON字符串：

import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Broker } from './broker.model';

@Injectable()
export class BrokerService {
  private apiUrl = 'api/Brokers/Create';
  private httpOptions = {
    headers: new HttpHeaders({
      'Content-Type': 'application/json'
    })
  };

  constructor(private http: HttpClient) { }

  addBroker(broker: Broker) {
    // 用JSON.stringify把对象转为JSON字符串，或者HttpClient会自动处理，但显式处理更保险
    return this.http.post<Broker>(this.apiUrl, JSON.stringify(broker), this.httpOptions);
  }
}

3. 核对Angular和WebAPI的Broker属性名称匹配 #

WebAPI的JSON序列化默认会把C#的帕斯卡命名（比如BrokerName）映射为驼峰命名（brokerName），但如果你的属性名完全不对应，就会绑定失败。比如：

• Angular端的Broker类：

export class Broker {
  id: number;
  fullName: string;
  contactEmail: string;
}

• 对应的C#类要保证属性名对应（或者用JsonPropertyName标记做映射）：

using System.Text.Json.Serialization;

public class Broker
{
    public int Id { get; set; }
    [JsonPropertyName("fullName")]
    public string FullName { get; set; }
    [JsonPropertyName("contactEmail")]
    public string ContactEmail { get; set; }
}

4. 用浏览器开发者工具验证请求Payload #

打开浏览器的F12开发者工具，切换到Network标签，发起请求后找到对应的POST请求，查看Payload选项卡，确认里面有正确的JSON数据。如果Payload是空的，那问题出在Angular端，比如你传递的broker对象是空的，或者没有正确赋值。

5. 确认请求URL和WebAPI路由匹配 #

检查Angular里的请求URL是否和WebAPI控制器的路由一致。比如如果你的控制器标记了[Route("api/[controller]")]，那么请求URL应该是api/Brokers/Create（假设控制器名为BrokersController），如果Create方法有自定义路由[HttpPost("AddBroker")]，那URL就要改成api/Brokers/AddBroker。

按照这几步排查下来，基本能解决参数为null的问题啦！

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