I am trying to upload an image. Normally I use axios call api. Since This call is not working with axios I tried with fetch.

I want to know what the difference between these two

Here are these two.

Axios // API CALL WITH NOT SUCCESSFUL WITH THIS ONE

axios
  .post(
    "userapi/UpdateUserProfileImage",
    {
      body: createFormData(photo, {}),
    },
    {
      headers: {
        "Content-Type": "multipart/form-data",
      },
    }
  )
  .then((res) => console.log(res.data))
  .catch((err) => console.log(err.response.data.Message));

Here is the fetch method. // this will successful

fetch("userapi/UpdateUserProfile", {
  method: "POST",
  headers: new Headers({
    "Content-Type": "multipart/form-data",
  }),
  body: createFormData(photo, {}),
})
  .then((data) => data.json())
  .then((res) => {
    console.log("upload succes", res);
  })
  .catch((error) => {
    console.log("upload error", error);
  });

What the difference between these two?

Here is the error when I use axios to call API.

Index was out of range. Must be non-negative and less than the size of the collection