.Net 7 API 不接受 List<IFormFile>

.Net 7 API won't accept List<IFormFile>

提问人:stijn 提问时间:11/17/2023 最后编辑:stijn 更新时间:11/17/2023 访问量:55

问:

我有以下方法

public async Task<IResult> AddImagesToComponent(ISender sender, int id, List<IFormFile> files)

这在以下定义为 POST 方法:

 public override void Map(WebApplication app)
 {
     app.MapGroup(this)
         //.RequireAuthorization()
         .MapGet(GetComponentsWithPagination)
         .MapGet(GetComponentInfo, "GetComponentInfo/{id}")
         .MapPost(CreateComponent)
         .MapPost(UploadComponentBook, "UploadComponentBook/{startPage}")
         .MapPost(AddImagesToComponent, "AddImages/{id}")
         .MapPut(UpdateComponent, "{id}")
         .MapPut(UpdateComponentDetail, "UpdateDetail/{id}")
         .MapDelete(DeleteComponent, "{id}");
 }

当我尝试使用以下代码从我的 VueJS 应用程序调用它时。我尝试发送的文件是图像。

try {
        const formData = new FormData();

        for (const file of files) {
          formData.append("files", file);
        }
        await axios.post(
          "https://localhost:5001/api/Components/AddImages/" +
            this.selectedComponent.id,
          formData,
          {
            headers: {
              "Content-Type": "multipart/form-data",
            },
          }
        );
      } catch (error) {
        alert(error);
        console.log(error);
      }

我收到 415 不支持的媒体类型响应。 我也从 Postman 尝试过这个,但我得到了相同的结果。

当我尝试使用单个文件作为 IFormFile 文件执行此操作时,它确实有效。

我已经尝试过使用 IList、ICollection、IFormFileCollection、IFormFile[] 进行过,但这些都不起作用。 我试图将 [FromForm] 属性添加到该方法中,但随后 NSwag 开始起作用并给出错误:

System.InvalidOperationException: files must have a valid TryParse method to support converting from a string. No public static bool List<IFormFile>.TryParse(string, out List<IFormFile>) method found for files.
1>   at Microsoft.AspNetCore.Http.RequestDelegateFactory.BindParameterFromValue(ParameterInfo parameter, Expression valueExpression, RequestDelegateFactoryContext factoryContext, String source)
C# asp.net ASP.NET-Core-WebAPI NSWAG

评论

0赞 Qing Guo 11/17/2023
你的文件是什么?你如何定义它?
0赞 stijn 11/17/2023
@QingGuo我在问题中添加了更多信息。我上传图片。<v-file-input v-on=“$listeners” accept=“image/*” label=“File input” hide-details variant=“outlined” ></v-file-input>

答:

0赞 Qing Guo 11/17/2023 #1

尝试:

[HttpPost("AddImages")]
public async Task<IResult> AddImagesToComponent(int id, List<IFormFile> files)
{
   //do your staff
}

演示如下:

 <input type="file" name="file" id="file" multiple />

  ...
try {
    const formData = new FormData();
     $.each($("input[type='file']")[0].files, function(i, file) {
        formData.append('files', file);
    });
    var id= this.selectedComponent.id;
   
    await axios.post(
      "https://localhost:5001/api/Components/AddImages/?id="+id,           
      formData,
      {
        headers: {
          "Content-Type": "multipart/form-data",
        },
      }
    );
  } catch (error) {
    alert(error);
    console.log(error);
  }

结果:enter image description here

评论

0赞 stijn 11/17/2023
我在问题中添加了更多信息。我上传图片。<v-file-input v-on=“$listeners” accept=“image/*” label=“File input” hide-details variant=“outlined” ></v-file-input>