Upload image from React Native to ASP.NET Core Web Api

I'm using react-image-picker to take pictures and get the URI but I'm having problems receiving images as an IFormFile in my API. When using the "Content-Type": "multipart/form-data" header my array is null. Without it the array is empty but the data is there as a key-value pair the value is of type object inside HttpContext.Request.Form.

I've tried using both axios and fetch. I've tried sending the object as a blob with the content-type specified as image/jpeg, I've tried stringifying the Asset object but my request doesn't show a content-type for the FormData no matter what.

I tried creating a quick Vue project and the request goes through to my API as a file there without any issues.

It seems like the difference comes down to whether the FormData has a content-type specified. on Vue, it looks like

------WebKitFormBoundaryQoBY2Xgnc8K2sTzQ Content-Disposition: form-data; name="photos"; filename="2560px-Random_Turtle.jpg" Content-Type: image/jpeg

while in react it looks like. It looks like it even ignores the filename that's set in the append.

------WebKitFormBoundaryQoBY2Xgnc8K2sTzQ Content-Disposition: form-data; name="photos"

Is there any way to force the content-type in the FormData? Using Blob like this doesn't change the request in any way

data.append("photos", new Blob([JSON.stringify(photo)], {type: "image/jpeg"}), "2560px-Random_Turtle")

React Native (Not working)

export const TestWithPhotosAPI = async (photos: Asset[]) => {  let data = new FormData();  if (containerAndPhotos.photos) {    containerAndPhotos.photos.forEach((photo) => {      data.append("photos", photo as Blob, "2560px-Random_Turtle");    });  }  fetch("https://myapi/postpicture", {    method: "POST",    body: data,  });};

Vue project (Works)

<script setup lang="ts">import { ref } from 'vue'const form = ref(null)const files = ref<FormData>(new FormData)const filesChange = (event ) => {  console.log(event.target.files);  Array.from(event.target.files).map((file, index) => {    console.log(file);    files.value.append("photos", file as Blob, event.target.files[index].name)  })}const upload = () => {  fetch('https://myapi/postpicture',    {      method: "POST",      body: files.value    }  );}</script><template><form ref="form" @submit.prevent="upload"><input type="file" name="file" multiple @change="(event) => filesChange(event)" /><input type="submit" /></form></template>

API (Works with Vue)

[HttpPost]public ActionResult SetAsDone([FromForm] ICollection<IFormFile> photos){    var httpRequest = HttpContext.Request.Form;    return Ok();}