FormData give axios network error in react native

Viewed 28

This runs okay and request sent to the server successfully

    axios({
      method: "post",
      url: `http://192.168.1.12:8000/user/image`,
      data: {formData}
    })
      .then((res) => {
        console.log(res)
      })
      .catch((err) => {
        console.log(err)
      })

But this gives axios network error:

    axios({
      method: "post",
      url: `http://192.168.1.12:8000/user/image`,
      data: formData
    })
      .then((res) => {
        console.log(res)
      })
      .catch((err) => {
        console.log(err)
      })

I am using it the same way in my other project(react) but that works fine, here in this project(react-native) it gives axios network error if I don't enclosed the formData in {}.

Here is react frontend:

enter image description here

Here is react backend, as you can see I am getting the req.file and req.body does not have the formData:

enter image description here

Here is react-native result, formData is coming in req.body and req.file is undefined:

enter image description here

1 Answers

pass the headers likewise -

   axios({
      method: "post",
      url: `http://192.168.1.12:8000/user/image`,
      data: formData,
      headers: { "Content-Type": "multipart/form-data" },
    })
      .then((res) => {
        console.log(res)
      })
      .catch((err) => {
        console.log(err)
      })
Related