AngularJS中HTTP POST发送对象列表失败，请求协助排查

我之前踩过一模一样的坑！用AngularJS的$http发对象列表到ASP.NET API时，后端始终接收为null，但单个对象和$.ajax却能正常工作，核心问题就是AngularJS的默认请求配置和ASP.NET API对集合的绑定规则不匹配，下面给你一步步解决：

1. 先确认API接口的正确写法 #

首先确保你的API方法加上了[FromBody]特性，而且参数类型是集合（比如List<Customer>、Customer[]或者IEnumerable<Customer>）：

[HttpPost]
[Route("api/customers/CreateCustomers")] // 确保路由和前端请求一致
public IHttpActionResult CreateCustomers([FromBody] List<Customer> customers)
{
    if (customers == null)
    {
        return BadRequest("未接收到客户列表");
    }
    // 你的业务逻辑
    return Ok();
}

这里[FromBody]是关键——ASP.NET API默认不会从请求体里自动绑定复杂类型的集合，必须显式标记。

2. 修正AngularJS的$http请求配置 #

$.ajax之所以能成，是因为它默认的contentType和序列化逻辑刚好契合API的要求，但$http的默认设置在发送数组时会有偏差，你需要显式指定请求头和序列化方式：

// 假设这是你的客户列表
var customerList = [
    { id: 1, name: "张三" },
    { id: 2, name: "李四" }
];

$http({
    method: 'POST',
    url: '/api/customers/CreateCustomers',
    data: JSON.stringify(customerList), // 显式转成JSON字符串
    headers: {
        'Content-Type': 'application/json; charset=utf-8' // 明确告诉API是JSON格式
    }
}).then(function successCallback(response) {
    console.log("发送成功！");
}, function errorCallback(response) {
    console.error("发送失败：", response);
});

为什么要这么写？ #

• AngularJS默认用angular.toJson()序列化数据，但有时候数组的序列化结果和ASP.NET API期望的格式有细微差异，用JSON.stringify()能确保格式完全标准。
• 显式设置Content-Type为application/json是核心——如果不指定，$http可能会用其他格式，导致[FromBody]无法正确解析数组。

3. 检查Customer类的属性匹配 #

一定要确保前端发送的对象属性名和后端Customer类的属性名大小写完全一致（C#是大小写敏感的！）：
比如前端发的是id和name，后端类要对应：

public class Customer
{
    public int Id { get; set; } // 这里是大写Id，前端如果发小写id会绑定失败
    public string Name { get; set; }
}

如果前端习惯用小写属性，你可以用Newtonsoft.Json的特性来做映射：

using Newtonsoft.Json;

public class Customer
{
    [JsonProperty("id")] // 映射前端的小写id
    public int Id { get; set; }
    [JsonProperty("name")] // 映射前端的小写name
    public string Name { get; set; }
}

4. 最后排查请求是否真的发送了数据 #

打开浏览器F12的Network标签，找到你的POST请求，查看Request Payload里是否有正确的数组数据——如果这里是空的，那肯定是前端代码的问题；如果数据正常，那再检查API的路由和参数配置。

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