How to send multipart/form-data to ASP.NET Core Web API?

Question

I'm trying to send a image and text fields to an API endpoint but I'm received

Unsupported content type 'multipart/form-data; boundary=---------------------------81801171514357

This is a ASP.NET Core 2.1 Web API. I have this:

[HttpPost("/api/account"), Authorize]
public void SaveUser(UserModel info)

And my model:

    [JsonProperty(PropertyName = "avatar")]
    [DataType(DataType.Upload)]
    public IFormFile Avatar { get; set; }

    [JsonProperty(PropertyName = "name")]
    [DataType(DataType.Text)]
    public string Name { get; set; }

Then I use axios:

    var formData = new FormData();
    formData.append("avatar", imageFile);
    formData.append("name", name);
    axios.post("/api/account", formData);

I expected this method to run, not throw an exception. But how? I have tried to add:

[Consumes("application/json", "multipart/form-data")]

But no success.

Then I tried:

[HttpPost("/api/account"), Authorize]
public void SaveUser([FromForm]UserModel info)

The method runs, but the properties is empty on info object :(

UPDATE: Solution, don't use JsonProperty PropertyName. Use the variable name.

Answer 1

Maybe you should try decorate controller input and model with [FromForm] attribute? See more info here: web api parameters binding.

In given example your controller action should look like this:

[HttpPost("/api/account"), Authorize]
public void SaveUser([FromForm]UserModel info)

In model:

[FromForm(Name="avatar")]
public IFormFile Avatar { get; set; }

[FromForm(Name="name")]
public string Name { get; set; }