如何使用 asp.net 核心中的 Fetch api 将数据传递给控制器答案

【问题标题】：How to pass data to controller using Fetch api in asp.net core如何使用 asp.net 核心中的 Fetch api 将数据传递给控制器
【发布时间】：2017-07-05 11:40:28
【问题描述】：

我在我的客户端 js 脚本中使用这样的 fetch 发布数据

    fetch('/myarea/mycontroller/myaction', {
        method: 'post',
        body: JSON.stringify({ name: namevalue, address: addressvalue })
    })
        .then(function (response) {
            if (response.status !== 200) {
                console.log('fetch returned not ok' + response.status);
            }

            response.json().then(function (data) {
                console.log('fetch returned ok');
                console.log(data);
            });
        })
        .catch(function (err) {
            console.log(`error: ${err}`);
        });
    }, false);

然后在我的控制器上

    [HttpPost]      
    public async Task<IActionResult> MyAction(string name, string address)
    {
        // Error, name and address is null here, shouldn't be!
        // more code here ...
    }

我的控制器动作被正确调用，我可以在其中调试，但没有数据被传递。这里有什么问题？谢谢

【问题讨论】：

标签： c# asp.net-core asp.net-core-mvc

【解决方案1】：

控制器操作需要查询参数 (/myaction?name=myname&address=myaddress)。这是默认设置。您将它们发送到正文中。

您可以更改 javascript 以将它们作为查询参数发送。（见这里：https://github.com/github/fetch/issues/256）

或者您可以告诉控制器操作从主体中获取值：

[HttpPost]      
public async Task<IActionResult> MyAction([FromBody] Person person)
{
    var myName = person.Name;
}

public class Person
{
    public string Name {get; set; }

    public string Address {get; set; }
}

【讨论】：

我在控制器中引入了 [FromBody] 和 PersonModel，但它不再在控制器处达到我的断点。它没有调用我的控制器。为什么会这样？
PersonModel 适用于查询字符串，但不适用于 [FromBody]
现在可以使用了！我只是设置了这样的 fetch api 标头：'Content-Type': 'application/json;'
添加 [FromBody] 无效，Content-Type 设置为 application/json 的事件
@KVM 我也没有。你设法让它工作了吗？

【解决方案2】：

只有在我将标头定义为“application/json”类型后，[FromBody] 属性才对我起作用：

fetch('api/Profile/Update', {
        method: 'post',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({ description: "Some text here" })
    });

这就是控制器动作的样子：

    [HttpPost("[action]")]
    public async Task<IActionResult> Update([FromBody] ProfileUpdateModel profileUpdateModel)
    {
        //Do some stuff here...
        return  RedirectToAction("/", "HomeController");
    }

description 属性现在接收来自请求的值。希望这能让解决这个问题的人最终清楚。

【讨论】：

您在 fetch 方法中包含的那个 URL：我假设 Profile 是控制器名称，而 Update 是操作方法。我进一步假设它在 api 文件夹中。您如何配置它以使其知道 api 文件夹在哪里？你能详细说明你的答案吗？
@DeanP 没有 api 文件夹 - 只有 [Route("api/[controller]")] 属性告诉 ASP 如何识别路由

【解决方案3】：

或者如果你有<form>...</form>，你可以使用

fetch('/url', {
    method: 'POST',
    credentials: 'include',
    headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
    body: $('#editContactModal form').serialize() 
    // body like "id=1&clientid=3&name=me&phones=123&email=@mail.com"
})

没有 [FromBody] ！！！（仅在控制器中使用常规操作方法）

【讨论】：