![](/img/trans.png)
[英]How to upload an image to the ASP.NET CORE WEB API in BYTE ARRAY format using React JS, 400 bad request
[英]“400 bad request” when posting data to asp.net core web api with FormData in XmlHttpRequest
我有一个 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 结果中显示以下错误:
输入字符串 '-------------18691991225667' 不是有效数字。 路径 '',第 1 行,position 43。
标题:出现一个或多个验证错误
我在发送 xhr 之前添加了这段代码以查看数据 object 的内容:
let formData = new FormData(document.getElementById("formEdit"));
for (let pair of formData.entries()) {
console.log(pair[0] + ': ' + pair[1] + ", " + typeof pair[1]);
}
结果如下:
idTache: 11
dateCreation: 2019-10-08
dateEcheance: 2019-10-22
priorite: 1
terminee: on
description: essai
这似乎是正确的。 那么我使用 FormData 有什么问题呢?
如果您想使用FormData
发布数据,则不应将Content-Type
设置为application/json
。此外,请在您的操作参数上使用[FromForm]
而不是[FromBody]
。
1.删除js代码中的以下行
req.setRequestHeader("Content-Type", "application/json");
2.使用[FromForm]
[HttpPost]
public void Post([FromForm] Tache tache)
结果如下:
idTache: 11 dateCreation: 2019-10-08 dateEcheance: 2019-10-22 priority: 1 terminee: on description: essai
由于您收到的数据是 model 类型Tache
,因此您需要传递一个名为id
的属性,而不是日志结果中显示的idTache
。
您不显示您的视图代码,我建议您使用name="id"
作为该输入文本框。
在我的情况下,正确的日志结果有一个__RequestVerificationToken:
,如果你使用<form id="formEdit">
:
id: 11
dateCreation: 2019-10-08
dateEcheance: 2019-10-22
priorite: 1
terminee: on
description: essai
__RequestVerificationToken:xxxxxxxx
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.