Axios post request network error on android

Describe the bug

0

So i’m posting a formdata object with axios to a node.js server. On iOS everything works perfectly, the data get posted and the image uploaded. But on android i’m getting this error. PLEASE NOTE THAT I DID READ THE PREVIOUS ISSUES AND TRIED THE SOLUTION. NOTHING WORKED !

To Reproduce

Code snippet to reproduce, ideally that will work by pasting into something like https://npm.runkit.com/axios, a hosted solution, or a repository that illustrates the issue. If your problem is not reproducible, please file under Support or Usage Question

const handleSubmit = async (listing, { resetForm }) => {
    
    const data = new FormData();
listing.images.forEach((image, index) =>
      data.append("images", {
        name: `product${Math.floor(Math.random() * 1000)}.`,
        uri: image,
      })
    );

    const res = await axios
      .post("http://192.168.43.8:5000/products/addProduct", data, {
        headers: {
          "Content-Type": "multipart/form-data",
        },
      //tried adding this but didn't work out
        transformRequest: (data) => data,
      })
      .then(function (response) {
        console.log(response);
      })
      .catch(function (error) {
        console.log(error);
        // handle error
      });
  }


}

Please note that on iOS it works without a problem. here’s a screenshot of the error when i used the react native debugger

Expected behavior

FORMDATA OBJECT POSTED TO NODE.JS server

Environment

• Axios Version 0.27.2

• Adapter : HTTP

• Browser : Chrome

• Browser : Version 103.0.5060.53 (Official Build) (arm64)

• Node.js : v14.17.5

• OS: macOS big sur version 11.4

• expo: “~45.0.0”

• “react-native”: “0.68.2”,

Additional context/Screenshots

Add any other context about the problem here. If applicable, add screenshots to help explain.

[mlazari]

Ok, so after a few hours of debugging, I finally found what’s wrong - it’s the Content-Type request header. If you don’t set it explicitly, then the default value is set here to application/x-www-form-urlencoded -> https://github.com/axios/axios/blob/v0.27.2/lib/defaults/index.js#L10 and that apparently makes the request fail on Android, but not on iOS. Setting the 'Content-Type': 'multipart/form-data' explicitly fixes the error. It was working in 0.26.1 because this code was removing the Content-Type header: https://github.com/axios/axios/blob/v0.26.1/lib/adapters/xhr.js#L32

[hemandpvkd]

Downgrade axios version to 0.24.0