javascript - 对 ASP.NET MVC Controller 的 JQuery JSON POST 请求未到达端点，但手动使用路由工作正常

Question

我有一个 ASP.NET 应用程序，它由一个前端组成，其中包含一个表单，我希望将其数据传递到我的 C# 后端。为此，我使用 JQuery post 请求来序列化表单数据并使用 JSON 将其发送到 Controller 。下面是我调用 Controller 路由的 Javascript 代码；

$(".data-submit").on("click",
        function(event) {
            var formArray = $("#amend-form").serializeArray();
            var json = JSON.stringify(formArray);

            $.post(windowLocationOrigin() +
                "/Instruction/AmendData", 
                json, 
                function (data) {
                    alert("api endpoint called");
                });

        });

这里是被调用的 Controller 端点

        [Route("[controller]/AmendData")]
        public IActionResult AmendPortingData([FromBody] string json)
        {
            return Ok(json);
        }

当我通过前端提交此表单时，将调用 onClick JS 事件并发送 post 请求，但 Controller 端点永远不会被命中。我在 return Ok(json) 上有一个断点提交表单后永远不会触发的行。

如果我检查开发人员工具，则会收到 500 错误，并显示消息:POST https://localhost:44358/Instruction/AmendData 500

但是，如果我随后向此网址 https://localhost:44358/Instruction/AmendData?json=123 提交请求终点被正确击中，我可以看到值 123在我的调试器中。

但是，我希望能够通过 post 请求正文发送数据，而不是通过 url 发送数据，因为提交的表单很大，并且包含太多需要通过 GET 发送的数据。

我尝试添加 [HttpPost]属性到 Controller 端点，但这会产生完全相同的行为，只是它不允许 GET url 工作。

Answer 1

您的 Controller 操作:

public IActionResult AmendPortingData(string json)

需要一个名为json的参数。

当你用以下方式调用它时:

 $.ajax({ url: url, data: "string" });

传递的数据没有参数名称，因此默认模型绑定(bind)器无法确定将数据的哪一部分应用于该参数。

这适用于:

http://url?json=string

当您指定参数名称?json=时，如果您使用以下方式调用操作

http://url/string

然后它会再次无法将“string”识别为参数“json”并且不起作用(尽管可能会给您一个更有用的“无法找到参数数据”错误)(当然假设没有额外的路由)。

通过为字符串参数指定名称，默认模型绑定(bind)器将能够将字符串与参数名称相匹配:

$.ajax({ url: url, data: { json: "string" }});

<小时/>

另一种方法是添加一个模型绑定(bind)器，它将接受任何 POST 字符串并将其传递给单个参数 - 但上面的方法通常更干净且更易于维护。

<小时/>

添加 [HttpPost] 将操作限制为该动词(因此，顺便说一句，添加 [HttpPost][HttpGet] 会使其无法使用，因为它必须是 POST并且必须是 GET)。

<小时/>

如果您从 View 模型构建表单，那么您可以直接在操作中使用该 View 模型:

public ActionResult MyAction(MyViewModel viewmodel)

并直接传递:

$.ajax({ url: url, data: $("form").serialize() });

默认的模型绑定(bind)器会将您的输入名称映射到 View 模型上的属性。