Sending formData using axios / fetch in react native

0
votes

From past few days I am trying to send formData using axios / fetch with required headers but the response is network error.

Could anyone please share a code snippet on how to make it work in react native.

Thanks,

code as follows:

 var formdata = new FormData();
 var file = new File([base64Data], "ISDD_" + this.state.fileName, { lastModified: new Date().getMilliseconds() })

    formdata.append("file", file, this.state.fileName);
    formdata.append("folderName", this.state.folderName);
    formdata.append("userName", "[email protected]");
    formdata.append("documents", documents);

  axios({
        url: url,
        method: 'POST',
        headers: {
            // "Content-Type": 'multipart/form-data',
            'enctype': 'multipart/form-data',
            'Cache-Control': 'sno-cache',
            'Pragma': 'no-cache'
        },
        data: formdata
    })
        .then((response) => {
            console.log(`1 ${response}`)
        })
        .catch((error) => {
            console.log(error)
        })
2
reactjsreact-nativeaxiosfetch
Share code of what you have attempted, so we can try to help – Travis James
We need more pieces of information like the code and error message you are getting. – Sathishkumar Rakkiasamy
@TravisJames I have added the code, please have a look at it. – Shariq
@SathishkumarRakkiasamy i have included my code for the reference, every time i make a api call it throws network error. – Shariq
formdata should be a FormData object. You should declare it before to append data to it: const formdata = new FormData(); formdata.append(...) – SylvainF

2 Answers

0
votes

Try like this,

    var formdata = new FormData();
    formdata.append("file", file, this.state.fileName);
    formdata.append("folderName", this.state.folderName);
    formdata.append("userName", "[email protected]");
    formdata.append("documents", documents);

axios({
    method: 'post',
    url: 'url',
    data: formdata,
    headers: {'Content-Type': 'multipart/form-data' }
    })
    .then(function (response) {
        //handle success
        console.log(response);
    })
    .catch(function (response) {
        //handle error
        console.log(response);
    });
0
votes

Try this:

 var formData = new FormData();  // make sure it is formData not formdata
axios({
        url: url,
        method: 'POST',
        headers: {
            "Content-Type": 'multipart/form-data',
        },
        formData
    })