JS向.NET Core MVC控制器传递Post参数失败，如何解决？

• 发送JSON格式请求时，ASP.NET Core无法自动将JSON对象的属性映射到方法的单个独立参数上，需通过模型类或[FromBody]特性完成绑定。
• 使用application/x-www-form-urlencoded格式时，数组参数需以key=value1&key=value2的形式传递，而非将数组序列化为单个字符串。

方案1：使用模型类接收JSON参数（推荐） #

步骤1：定义数据传输对象（DTO） #

在.NET Core项目中创建匹配前端JSON结构的类：

public class SampleRequest
{
    public string[] Names { get; set; }
    public int Age { get; set; }
}

步骤2：修改控制器方法 #

用DTO作为参数并添加[FromBody]特性，显式指定从请求体绑定数据：

[Route("api/[controller]")]
public class DatabaseController : Controller
{
    [HttpPost("sample")]
    public IActionResult Sample([FromBody] SampleRequest request)
    {
        // request.Names = ["ahmad", "mutawa"]，request.Age = 22
        return Json(/* 返回目标数据 */);
    }
}

前端代码保持不变 #

原有JS代码无需修改，已正确发送JSON格式请求：

const data = await fetch("/api/database/sample", 
{ 
    method: "post", 
    headers: { "Content-Type": "application/json; charset=UTF-8" },
    body: JSON.stringify({ names: ['ahmad', 'mutawa'], age: 22 })
});

方案2：直接用[FromBody]绑定动态对象（适合简单场景） #

若不想创建模型类，可通过动态对象接收，但类型安全性较差：

[HttpPost("sample")]
public IActionResult Sample([FromBody] dynamic request)
{
    string[] names = request.names.ToObject<string[]>();
    int age = request.age;
    // 业务逻辑处理
    return Json(/* 返回目标数据 */);
}

方案3：使用form-urlencoded格式并正确传递数组 #

若坚持使用表单编码格式，需修改前端代码拆分数组参数：

前端代码修改（FormData方式） #

const formData = new FormData();
formData.append("names", "ahmad");
formData.append("names", "mutawa");
formData.append("age", 22);

const data = await fetch("/api/database/sample", 
{ 
    method: "post", 
    body: formData
});

前端代码修改（URLSearchParams方式） #

const params = new URLSearchParams();
params.append("names", "ahmad");
params.append("names", "mutawa");
params.append("age", 22);

const data = await fetch("/api/database/sample", 
{ 
    method: "post", 
    headers: { "Content-Type": "application/x-www-form-urlencoded" },
    body: params
});

控制器方法保持不变 #

此时原控制器方法可正确接收参数：

[HttpPost("sample")]
public IActionResult Sample(string[] names, int age)
{
    // names = ["ahmad", "mutawa"], age = 22
    return Json(/* 返回目标数据 */);
}

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