将文件发送到（获取到 c# web api）

Question

我尝试通过 JS Fetxh API 将文件发送到 ASP .NET 6 WebAPI 并获得 400 状态。

let data = new FormData()
data.append('file', file)
const response = await fetch('https://localhost:7054/Pictures',
{
    method: 'POST',
    headers: {
         'Content-Type': 'multipart/form-data'
    },
    body: data
});

[HttpPost]
public async Task<ActionResult> Index([FromBody]IFormFile file)
{
    try
    {
        using (var fs = new FileStream(dir, FileMode.Create))
        {
             await file.CopyToAsync(fs);
        }
        return StatusCode(StatusCodes.Status201Created);
    }
    catch
    {
        return StatusCode(StatusCodes.Status500InternalServerError);
    }
}

如果删除 FormData 并发送 'file' 得到同样的错误。如果删除 'Content-Type' 在每种情况下都会获得 415 状态。如果将 'Content-Type' 设置为 'application/json' 并将 IFormFile 更改为字符串，然后发送 json 就可以了。

Answer 1

1.[FromBody]用于接收application/json数据。您需要将 [FromBody] 更改为 [FromForm]

2.To 上传文件使用 fetch 和 FormData。您不能设置 Content-Type header。

下面的整个工作演示：

let data = new FormData();
data.append('file', file);
const response = fetch('https://localhost:7054/Pictures',
{
    method: 'POST',  
    body: data
});

Api 控制器：

[HttpPost]
public async Task<ActionResult> Index([FromForm] IFormFile file)
{
   //.....
}

将文件发送到（获取到 c# web api）

Send file to (fetch to c# web api)

javascript

c#

asp.net

fetch

asp.net-core-webapi