使用 XmlHttpRequest 中的 FormData 将数据发布到

Question

我有一个带有此操作的 ASP.Net Core Web API：

    // POST api/TodoList

    [HttpPost]

    public void Post([FromBody] Tache tache)

    {

       TodoListContext.AjouterTache(tache);

    }

这是 Tache 实体的代码：

    public class Tache

    {

       public int Id { get; set; }

       [DataType(DataType.MultilineText)]

       [Required, MaxLength(250)]

       public string Description { get; set; }

       [DataType(DataType.Date)]

       public DateTime DateCreation { get; set; }

       [DataType(DataType.Date)]

       public DateTime DateEcheance { get; set; }

       public int Priorite { get; set; }

       public bool Terminee { get; set; }

    }

我从 javascript SPA 调用操作，使用 XHR 如下：

    function ajouterTache() {

       // Construit un objet Tâche à partir des valeurs saisies

       let tache = {}; 

       tache.id = document.getElementById("idTache").value;

       tache.dateCreation = document.getElementById("dateCreation").value;

       tache.dateEcheance = document.getElementById("dateEcheance").value;

       tache.priorite = document.getElementById("priorite").value;

       tache.terminee = document.getElementById("terminee").checked;

       tache.description = document.getElementById("description").value; 

       console.log(tache);

       // Envoie la tâche à l'API

       const req = new XMLHttpRequest();

       req.onload = function () {

          ...

       };

       req.open('POST', uri, true);

       req.setRequestHeader("Content-Type", "application/json");

       req.send(JSON.stringify(tache));

    }

上面的代码工作正常，但这个没有：

    function ajouterTache() {

       data = new FormData(document.getElementById("formEdit"));

       // Envoie la tâche à l'API

       const req = new XMLHttpRequest();

       req.onload = function () {

        ...

       };

       req.open('POST', uri, true);

       req.setRequestHeader("Content-Type", "application/json");

       req.send(data);

    }

表单的每个字段都有正确的名称，已启用并包含有效的输入。

但我总是得到“400：错误的请求”响应。

Firefox 的调试工具在 XHR 结果中显示以下错误：

这似乎是正确的。那么我使用 FormData 有什么问题？

Answer 1

如果你想用 发布数据 FormData，那么你不应该设置Content-Type为application/json.Besides，在你的操作参数上使用[FromForm]而不是[FromBody]。1.在js代码中删除以下行req.setRequestHeader("Content-Type", "application/json");2.使用【FromForm】[HttpPost]&nbsp;public void Post([FromForm] Tache tache)结果如下：idTache：11 dateCreation：2019-10-08 dateEditorial：2019-10-22 优先级：1 已完成：在描述：测试由于您将数据作为模型 Type 接收Tache，因此您需要传递一个名为id而不是idTache显示在日志结果中的属性。您没有显示您的视图代码，我建议您使用name="id"该输入文本框。在我的情况下，正确的日志结果有一个__RequestVerificationToken:，如果您使用它，它也是expeted <form id="formEdit">：id: 11dateCreation: 2019-10-08dateEcheance: 2019-10-22priorite: 1terminee: ondescription: essai__RequestVerificationToken:xxxxxxxx