Multipart/form-data ASP.NET Core 6 backend - 415 Unsupported Media Type

Question

I have a minimal API (or Web API?) that should receive form data (fields, plus a file).

I read that I have to decorate my endpoint with [FromForm] to get the data, but it's not working.

When I submit the form, I get an error (415 unsupported media type) it doesn't even get to the point where it should print "Received" on the console.

I also tried sending a form-data from postman and the same error comes back (415)

Here is my code:

const onSubmit = async (data: any) => {
    setUploading(true);
    // Add form values to formdata, including files
    let formData = new FormData();
    for (let key in data) {
      if (key === "file") {
        data.file.forEach((f: any) => {
          formData.append("file", f.originFileObj);
        });
        continue;
      }
      formData.append(key, data[key]);
    }

    try {
      const response = await axios.post("http://localhost:5210/file", formData, { headers: { "Content-Type": "multipart/form-data" } });
      message.success("File sent successfully!");
      form.resetFields();
    } catch (error: any) {
      console.log(error.response.data);
    }
    setUploading(false);
  };

using Microsoft.AspNetCore.Mvc;

var builder = Microsoft.AspNetCore.Builder.WebApplication.CreateBuilder(args);
builder.Services.AddCors(options=> options.AddDefaultPolicy(builder => {builder.AllowAnyOrigin().AllowAnyHeader().AllowAnyMethod();} ));

var app = builder.Build();
app.UseCors();

app.MapPost("/file" ,([FromForm] FormData data)=>{
    System.Console.WriteLine("Received");
     return data;
});

app.Run();

My FormData class :

public class FormData
{
    public string? firstName { get; set; }
    public string? lastName { get; set; }
    public string? company { get; set; }
    public string? sendTo { get; set; }
    public IFormCollection? files { get; set;}
}

Answer 1

Found solution here: .NET 6 Minimal API and multipart/form-data

What i had to do is remove [FromForm] as it looks like it is no longer supported by .Net 6. (https://learn.microsoft.com/en-us/aspnet/core/fundamentals/minimal-apis?view=aspnetcore-6.0#explicit-parameter-binding)

I also don't need the Model (FormData) class for this to work.

Changing my endpoint to this solved my issue

app.MapPost("/file",(HttpContext ctx)=> {

    var data = ctx.Request.Form; // form data is stored here
    var files = ctx.Request.Form.Files; // files are stored here
    
    return "Success";
    });

the way the data is returned is a bit ugly, so now my next goal is to clean it up, but that is a different topic.

this is what data looks like:

[
    {
        "key": "firstName",
        "value": [
            "Mike"
        ]
    },
    {
        "key": "lastName",
        "value": [
            "Jones"
        ]
    },
    {
        "key": "company",
        "value": [
            "123Net"
        ]
    },
    {
        "key": "sendTo",
        "value": [
            "Someone"
        ]
    }
]