如何从ASP.NET MVC向ASP.NET Core Web API发送PUT请求？

问题汇总 #

• 前端Kendo DataSource的update配置错误：未指定请求类型导致默认用GET提交，GET请求无请求体无法匹配后台[FromBody]接收规则；未设置contentType: "application/json"，参数默认以URL拼接形式传递不符合接收要求；未配置parameterMap序列化参数，后台无法解析请求体。
• ASP.NET MVC的Update Action配置错误：未添加[HttpPost]/[HttpPut]请求限制，仅能接收GET请求，无法处理带请求体的提交。
• API调用路由不匹配：后端API的Update接口路由是api/Update，但MVC中调用地址为api/Product，路径不匹配导致请求永远无法到达API接口。

修复方案 #

1. 修正Kendo视图代码

<script>
    //----------TRANSPORT -------------------//
    var dataSource = new kendo.data.DataSource({
        batch: false,
        transport: {
            read: {
                url: "https://localhost:44393/api/Product",
                dataType: "json"
            },
            update: {
                url: "@Url.Action("Update", "Home")",
                dataType: "json",
                contentType: "application/json", // 指定请求媒体类型
                type: "POST" // 指定请求类型为POST，也可根据需求改为PUT
            },
            create: {
                url: "@Url.Action("Create", "Home")",
                dataType: "json",
                contentType: "application/json",
                type: "POST"
            },
            destroy: {
                url: "@Url.Action("Delete", "Home")",
                dataType: "json",
                type: "DELETE" // 补充DELETE请求类型
            },
            // 新增：将提交参数序列化为JSON字符串
            parameterMap: function(options, operation) {
                if (operation === "update" || operation === "create") {
                    return kendo.stringify(options);
                }
                return options;
            }
           },
        pageSize: 5,
        schema: {
            model: {
                id: "id",
                fields: {
                    id: { editable: false, nullable: true },
                    productName: { type: "string", editable: true },
                    prouctSKU: { type: "string", editable: true },
                    productType: { type: "string", editable: true },
                }
            }
        }
    });
</script>

2. 修正ASP.NET MVC Update Action

[HttpPost] // 限制仅接收POST请求，与前端配置的type对应
public ActionResult Update(Guid id, [FromBody]Product product)
{
    using (var client = new HttpClient())
    {
        client.BaseAddress = new Uri("https://localhost:44393");
            
        var json = JsonConvert.SerializeObject(product);

        var contentData = new StringContent(json, Encoding.UTF8, "application/json");
        // 修正API调用路径，与后端API配置的路由匹配
        var response = client.PutAsync("/api/Update", contentData);

        var result = response.Result;

        if (result.IsSuccessStatusCode)
        {
            return RedirectToAction("Index");
        }
    }

    return View(product);
}

3. 可选优化（API接口参数绑定）

如果API接口仍无法接收请求，可给参数添加[FromBody]属性，显式指定从请求体读取内容：

[HttpPut]
[Route("api/Update")]
public async Task<IActionResult> Update(Guid id, [FromBody]UpdateProductCommand command)
{
    if (id != command.Id)
    {
        return BadRequest();
    }

    return Ok(await _mediator.Send(command));
}

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