React-native: TypeError: Network request failed On Android

[keyz23]

Hi Everyone, I found this problem on my React-Native Android App.
When I using a fetch to communicate with a working api, this type of error is returned to me.

TypeError: Network request failed

I Used the Chrome debbuger and I found this:

TypeError: Network request failed at XMLHttpRequest.xhr.onerror (whatwg-fetch.js:504) at XMLHttpRequest.dispatchEvent (event-target.js:172) at XMLHttpRequest.setReadyState (XMLHttpRequest.js:580) at XMLHttpRequest.__didCompleteResponse (XMLHttpRequest.js:394) at XMLHttpRequest.js:507 at RCTDeviceEventEmitter.emit (EventEmitter.js:181) at MessageQueue.__callFunction (MessageQueue.js:366) at MessageQueue.js:106 at MessageQueue.__guard (MessageQueue.js:314) at MessageQueue.callFunctionReturnFlushedQueue (MessageQueue.js:105)

This is the code that I used:

`static creaUtente(identity, FirstName, LastName, FiscalCode , Email) {
let formdata = new FormData();
formdata.append('Identity', identity);
formdata.append('FirstName', FirstName);
formdata.append('LastName', LastName);
formdata.append('FiscalCode', FiscalCode);
formdata.append('Email', Email);

    console.log(Configuration.base_url.rest + Configuration.apiRoutes.signUp)
    console.log(formdata)

    return new Promise((resolve, reject)=> {
        fetch('https://linktotheapi.com',{
            method: 'POST',
            headers: {
                'Content-Type': 'multipart/form-data',
            },
            body: formdata
        })
        .then((response) => response.json())
        .then((responseData) => {
            if(responseData.Error){
                Alert.alert("Errore");
            }
            global.utente = responseData;
            resolve(responseData)
        })
        .catch((err) => {reject(err)})
    })
}`

I manually tried to use the API and it works. So the problem is fetch.
I have seen and read that a lot have encountered this problem on android without a real solution.

The API link is a link type: https: //**.com (it is not a localhost).
I tried to use the http version of the API but the error still appears.

Now, This is my package.json

dependencies": { "@react-native-community/async-storage": "^1.4.2", "buffer": "^5.2.1", "pouchdb-adapter-asyncstorage": "^6.4.1", "pouchdb-authentication": "^1.1.3", "pouchdb-find": "^7.0.0", "pouchdb-react-native": "^6.4.1", "react": "16.8.3", "react-native": "0.59.4", "react-native-ble-manager": "^6.6.2", "react-native-ble-plx": "^1.0.3", "react-native-json-tree": "^1.2.0", "react-native-keyboard-aware-scroll-view": "^0.8.0", "react-native-router-flux": "^4.0.6", "react-native-tab-navigator": "^0.3.4", "react-native-vector-icons": "^6.4.2" }, "devDependencies": { "@babel/core": "7.4.3", "@babel/runtime": "7.4.3", "babel-jest": "24.7.1", "jest": "24.7.1", "metro-react-native-babel-preset": "0.53.1", "react-test-renderer": "16.8.3" }, "jest": { "preset": "react-native" } }

I have read that this problem is on Android Device ( I obviously added internet permissions in the Manifest file ). Do you know nothing about this problem??

[react-native-bot]

Thanks for submitting your issue. Can you take another look at your description and make sure the issue template has been filled in its entirety?

👉 Click here if you want to take another look at the Bug Report issue template.

[lucky-newbie]

did you solve it? i met too...

[keyz23]

No I haven't solve it...

[keyz23]

Nobody?

[Valiums]

hey @keyz23 @823844596,
I recently encountered something similar using fetch and formDatas (only on Android though).
The workaround that worked for me was to use XMLHttpRequest instead of fetch.
Hopefully this will help you too!

I don't know if you are using expo but for me this problem started when I updated my expo SDK from 31 to 33 (so RN 0.57.1 to 0.59.8)

[amohit1315]

Was anyone able to solve it??
I am facing similar issue with fetch. I have to use common code for android and iOS. fetch works great in iOS but in android throws error.

Trying to fetch data from remote server via api.
Using fetch(https:url:port) to fetch the data. But every time android emulator as well as physical device gives network request failed. While I can access same url within browser of emulator.

I have already went through various links, and many people have posted same problem but none of them had ample solution that works. While some people were not able to access localhost via api-call but it was resolved using IP address of system. But in my scenario I am trying to access remote host. Also domain name cannot be used in my scenario, so need a solution using (ip) in fetch method=get.

testlogin = https://10.209.7.115:8080/api/v1/
Basicauth = 'Basic cm9vdDpyb290'

fetch(testingLogin, {
method: "GET",
cache: "no-cache",
mode: "cors",
withCredentials: true,
credentials: "include",
headers: {
'Authorization':Basicauth,
Accept: "application/json",
"Content-Type": "application/json"
}
}).then(response =>
{
if(response.status === 200)
{
this.props.navigation.navigate('Home');
}
else
{
alert("Authorization failed");
}
})
.catch(error => {
alert("Request Failed :Check the ip address Entered:Problem with server ");
throw(error);

   })

Error:

TypeError: Network request failed
onerror@http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false:24051:31
dispatchEvent@http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false:28695:31
setReadyState@http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false:28448:33
__didCompleteResponse@http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false:28275:29
emit@http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false:3280:42
__callFunction@http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false:2577:49
http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false:2334:31
__guard@http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false:2531:15
callFunctionReturnFlushedQueue@http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false:2333:21

[garrinmf]

@keyz23 you closed the ticket, but did you find a fix for it?

[IcebergRage]

@keyz23 @garrinmf do you find a solution ?

[garrinmf]

@IcebergRage, I got past this, forgot I'd commented anywhere though and it's a bit fuzzy now.

I believe in my case it was failing when I only had the header for Content-Type: "multipart/form-data" as that was enough to make it work on iOS. But, on Android, I also had to specify that I wanted JSON back with the header Accept: "application/json". Simply specified both and 💥.

[Ailton265]

I have the same issue. Did any one was able to solve it?

[CYBERNEURONES]

Why this issue is not fix ?

[Dantalion]

Same issue. Still no fix?

[daybreaker]

We're having the same issue here but on iOS. Using rn 0.53. It was working fine a while ago.

The weird thing is if I have RN Debugger open, our code works. But with remote debugging turned off, everything with fetch returns a Network Request Failed error.

I know that when RN Debugger is open, RN uses V8 to run the code, and when remote debugging is off, it uses the device/simulator's native JavaScriptCore... I wonder if the most recent version of iOS has an updated version of JavaScriptCore that implements fetch differently from V8?

I'm not educated enough in the internals of javascript engines to get much further than this, though.

Any help would be appreciated.

[DodoTheDeveloper]

Dear fellow developers, please check out my comment on the similar issue #24394 . I hope it will help some of you.

[Lpaydat]

I solved it but I'm not sure is it the same issue with you guys.

In my case, I used expo (in an android device) together with relay-modern and this error occurs when I try to fetch data from my server (localhost).

After spending an hour to find the solution with no results I just find out the source of my error.
It is the fetch url (I used localhost and it works in the browser so I just forgot about it).
When I change the url to the correct ip address, this issue have gone.

I hope this helps and sorry for my bad English.

[EzeRangel]

This is a problem with the cert. Your server should use intermediate certificates so Android should not reject the requests.

[Papyrus0120]

issue is not fixed then y its closed

[alanhalpern06]

I have the same problem here, the most curious thing is that this error just happen when it's a POST request, on my GET requests it's is working well.
Somebody have any ideia?

On postMan my request Workswell too!

My code:

NetInfo.fetch().then(isConnected => {
            if(isConnected) {
                var url = "http://vvendas.com/api/home";
                var data = new FormData();                    
                data.append('dateBegin', dateBegin);
                data.append('dateEnd', dateEnd);
                data.append('format', 'json');
                fetch(url, {
                    method:'POST',
                    headers:{
                        'Accept': 'application/json', 
                        'Content-Type': 'application/json',
                        'Authorization': "Bearer "+ userToken
                      },
                    mode:"cors",
                    body: data,
                    redirect: 'follow'
                }).then(response => response.json())
                .then(resJSON => {

                    console.log('It WORKS',resJSON)
                }).catch(err => {
                     console.log(err)                  
                })
            }else{
                console.log('not Connected')
            }
        })

The terminal result :
LOG [TypeError: Network request failed]

The Chrome Debbug (ctrol+m -> Debug) :
TypeError: Network request failed at XMLHttpRequest.xhr.onerror (index.bundle?platfor…&minify=false:26748) at XMLHttpRequest.dispatchEvent (index.bundle?platfor…&minify=false:32302) at XMLHttpRequest.setReadyState (index.bundle?platfor…&minify=false:31386) at XMLHttpRequest.__didCompleteResponse (index.bundle?platfor…&minify=false:31213) at index.bundle?platfor…&minify=false:31323 at RCTDeviceEventEmitter.emit (index.bundle?platfor…e&minify=false:3316) at MessageQueue.__callFunction (index.bundle?platfor…e&minify=false:2648) at index.bundle?platfor…e&minify=false:2361 at MessageQueue.__guard (index.bundle?platfor…e&minify=false:2602) at MessageQueue.callFunctionReturnFlushedQueue (index.bundle?platfor…e&minify=false:2360)

[ThalesCrisostomo]

Anything about that?

[alessiocancian]

Had a similar problem after upgrading react native, the only way I was able to solve it is using RNFetchBlob, as shown here: https://stackoverflow.com/a/50061209/5724186

[Baterka]

I have same problem on RN 0.62 :( Working fine in release but in debug very annoying!

[dotfelixb]

Add this to your manifest

<application
    ...
    android:usesCleartextTraffic="true"
    ...>
    ...
</application>

[devkrkanhaiya]

step1>
add android:usesCleartextTraffic="true" line in AndroidManifest.xml like:

...
android:usesCleartextTraffic="true"> // add this line
...

step2>
Delete all debug folder from your android folder..

[akhan118]

@dotfelixb @devkrkanhaiya work on RN .62 👆💕

[Temirtator]

@dotfelixb @devkrkanhaiya work on RN .62 👆💕

This solution doesnt solve my problem

[dotfelixb]

@Temirtator This is not a react native issue, is from Android so look into this, hope it helps

<application android:networkSecurityConfig="@xml/network_security_config"
                    ... >
        ...
    </application>

then create a file in your as res/xml/network_security_config.xml

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <domain-config>
        <domain includeSubdomains="true">example.com</domain>
        <trust-anchors>
            <certificates src="@raw/my_ca"/>
        </trust-anchors>
    </domain-config>
</network-security-config>

you can read more at
Network security configuration

[Temirtator]

@dotfelixb thanks for your answer. I found out, problem was with fetch request, so, to solve this problem, Im using RNFetchBlob(https://github.com/joltup/rn-fetch-blob) library, for sending files to server. But lately i'll check your solution.

[amit-tanwar]

step1>
add _android:usesCleartextTraffic="true"_ line in AndroidManifest.xml like:

...
android:usesCleartextTraffic="true"> // add this line
...

step2>
Delete all debug folder from your android folder..

It worked for me "react-native": "0.62.2"

[apostolou]

@amit-tanwar, @devkrkanhaiya , @dotfelixb , I've tried to insert the line you mention (add android:usesCleartextTraffic="true" ) in the AndroidManifest.xml file but didn't manage to make this work because I don't find the path of the debug folder to delete. Could you please explicitely give the path ? thanks a lot!

[dotfelixb]

@apostolou the debug folder is at "project_name//android/app/src/debug",
not there's also an AndroidManifest.xml file that needs android:usesCleartextTraffic="true" too.

[apostolou]

@dotfelixb thanks for your feedback. Deleting the folder didn't fix the issue 👎 unfortunately.
I switched to rn-fetch-blob to make my upload work.

[amit-tanwar]

@amit-tanwar, @devkrkanhaiya , @dotfelixb , I've tried to insert the line you mention (add android:usesCleartextTraffic="true" ) in the AndroidManifest.xml file but didn't manage to make this work because I don't find the path of the debug folder to delete. Could you please explicitely give the path ? thanks a lot!

Path is shared by @apostolou and hope you rebuild the app after following the steps. Usually (For me atleast) best approach is to close the metro server and restart with the command "react-native start --reset-cache" and rebuild the app.

[cultofdev]

same here, I can't get this to work with just a simple get request from a secured api, here is the snippet:

fetch('https://domainofapi/api/emp/position/all', {
method: 'GET',
cache: 'no-cache',
mode: 'cors',
headers: {
'Accept': 'application/json',
},
})
.then(response => response.json())
.then(json => setPositions(json));

tried almost every solution I can find, usesCleartextTraffic, network security config, etc.

[Brianop]

@cultofdev Did you find a fix for this ?

[cultofdev]

@cultofdev Did you find a fix for this ?

No, after 3 days I just trashed the project and switched to flutter, and besides most of the suggested fixes that I found on the net is just a workaround and not even working..

[dotfelixb]

@cultofdev this is not a react-native bug, it's just the version of Android react-native is using

[NSR88]

Add this to your manifest

<application
    ...
    android:usesCleartextTraffic="true"
    ...>
    ...
</application>

I already have this, but still not working :(

[NSR88]

hey @keyz23 @823844596,
I recently encountered something similar using fetch and formDatas (only on Android though).
The workaround that worked for me was to use XMLHttpRequest instead of fetch.
Hopefully this will help you too!

I don't know if you are using expo but for me this problem started when I updated my expo SDK from 31 to 33 (so RN 0.57.1 to 0.59.8)

I also tried using XMLHttpRequest, but its returning me error 406

export async function uploadXHR(url, data) {
  var formData = new FormData();
  for (let key in data) {
    formData.append(key, data[key]);

  }
  formData.append('jsonKey', {CompanyCode:"Demo3"});

  var xhr = new XMLHttpRequest();

  return new Promise(
    function (resolve, reject) {

      xhr.open("POST", url);

      xhr.onload = function () {
        if (this.status >= 200 && this.status < 300) {
          resolve(xhr.response);
        } else {
          // console.log('StatusText: '+xhr.statusText);
          reject({
            status: this.status,
            statusText: xhr.statusText
          });
        }
      };
      xhr.onerror = function () {
        reject({
          status: this.status,
          statusText: xhr.statusText
        });
      };
      xhr.send();


    }
  );

}

[Slals]

Project on RN v0.63.0-rc.1

I'm also getting Network request failed without any other infos.

I tried :

• Updating Flipper SDK to 0.44.0 and 0.46.0 ;
• Adding android:usesCleartextTraffic="true" in src/main/AndroidManifest.xml ;
• Adding android:networkSecurityConfig="@xml/network_security_config" in src/main/AndroidManifest.xml where network_security_config is

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <domain-config cleartextTrafficPermitted="true">
        <domain includeSubdomains="true">mydomain.com</domain>
    </domain-config>
</network-security-config>

• Commenting out all network related snippets from ReactNativeFlipper.java.

None worked, tried on a working URL, simple GET method. fetch is failing somewhere but I have no idea where it comes from. Anyone know how we can track this issue?

[nkpatnis]

Was facing same issue for RN 0.62.2
and was able to fix it by updating this
https://github.com/jhen0409/react-native-debugger/releases
to v0.11.3

cleartextTrafficPermitted="true" this should not be used in production until you know what you are doing.

[josmithua]

In my case it was only not working for localhost URLs. I changed localhost in the URL to my local IP and it worked. (RN 0.62.2)

[f4z3k4s]

As it seems nobody has been as careless as I were when running into this, but I'll give my two cents, hopefully it will help somebody save some time:

• [ ] The emulator that you are using has access to the internet and you are sure about it (e.g.: tested it outside of this app). If not, maybe this link can help. It was the source of this issue in my case. I added Google's DNS server (8.8.8.8) to my Mac's network configurations and voilà, everything started to work. Note that I was working from an iPhone hotspot and that's why I had to set this up. If I am on wifi, it works perfectly without this extra configuration.

• [ ] The real device that you are using has access to the internet and you are sure about it (e.g.: tested it outside of this app).

If above boxes are checked meaning that your requests work perfectly from a browser, you could try debugging the issue further. 🤗

PS: I've just tested it on a 5ish-year-old Lenovo device with Android 5.1 and it works, also my Pixel 2 emulator with API 29.

[zcmgyu]

Just not work on Android.
android:usesCleartextTraffic="true" also does not thing

[devkrkanhaiya]

Just not work on Android.
android:usesCleartextTraffic="true" also does not thing

Delete all debug folder from your android folder..

[akmallmr]

Not work on me..

[yashwantt]

step1>
add _android:usesCleartextTraffic="true"_ line in AndroidManifest.xml like:

...
android:usesCleartextTraffic="true"> // add this line
...
step2>
Delete all debug folder from your android folder..

Awesome this worked for me

[asim47]

I fixed it by commenting a line in the
/android/app/src/debug/java/com/{your-app-name}/ReactNativeFlipper.java
file.
this is only fix that worked for me!

new NetworkingModule.CustomClientBuilder() {
@override
public void apply(OkHttpClient.Builder builder) {
// builder.addNetworkInterceptor(new FlipperOkhttpInterceptor(networkFlipperPlugin));
}
});

[Kipsanga-Gregory]

I fixed it by commenting a line in the
/android/app/src/debug/java/com/{your-app-name}/ReactNativeFlipper.java
file.
this is only fix that worked for me!

new NetworkingModule.CustomClientBuilder() {
@override
public void apply(OkHttpClient.Builder builder) {
// builder.addNetworkInterceptor(new FlipperOkhttpInterceptor(networkFlipperPlugin));
}
});

Thanks Buddy, this one worked for me too. However, is it cool to just have that function return nothing now that we commented out its return value? please someone let me know about this

[Baterka]

...However, is it cool to just have that function return nothing now that we commented out its return value?

Its void method :) it is not returning anything even when not commented ;)

[Calls4ever]

same problem looks like no body is fixing this problem

[safciplak]

ccept: "application/json"

is it works?

[akhan118]

android/gradle.properties

Add this

FLIPPER_VERSION=0.50.0

[pedrogarciyalopez]

android/gradle.properties

Add this

FLIPPER_VERSION=0.50.0

that's worked for me.

@akhan118 thanks a lot dude!

[dotfelixb]

same problem looks like no body is fixing this problem

This is not a react native specific issue, is more of Android 9.

[lorenz068]

It happens to me on Android 8 and "react-native": "0.62.2",
I send my position to the server with almost the same payload and sometimes it just failed randomly

[Liqiankun]

@devkrkanhaiya What are the debug folders?

[safaiyeh]

Hi all, we have a discussion here tracking this: https://github.com/facebook/react-native/issues/28551

There are a series of workarounds, mentioned in the thread. Check it out!

[Liqiankun]

29845 For me case.

[Cyberon256]

@alanhalpern06
All should be well with these changes

- data.append('dateBegin', dateBegin);
+ data.append('dateBegin', dateBegin.toISOString());
- data.append('dateEnd', dateEnd);
+ data.append('dateEnd', dateEnd.toISOString());

- 'Content-Type': 'application/json',
+ 'Content-Type': 'multipart/form-data',

[Cocktails0921]

Same issues in here.
Fetch does not work well in Andorid.
Sometimes it returns error that is Network request failed.
It works well only IOS.
Is there any solutions to solve this?

[Liqiankun]

@Cocktails0921 #29845

[jamesjara]

Based on this code https://github.com/facebook/react-native/blob/476a336e3613f90b76e3a91d5bffaa098bf4e6ff/ReactAndroid/src/main/java/com/facebook/react/modules/network/NetworkingModule.java#L383 any request without headers content-type and payload body as string will start failing into "Network request failed." this is because the high-level wrappers are handing the Request Error call as "Network request failed." but is not even reaching the internet.

1.

    try {
      sendRequestInternal(
          method,
          url,
          requestId,
          headers,
          data,
          responseType,
          useIncrementalUpdates,
          timeout,
          withCredentials);
    } catch (Throwable th) {
      FLog.e(TAG, "Failed to send url request: " + url, th);
      ResponseUtil.onRequestError(getEventEmitter(), requestId, th.getMessage(), th);
    }
  }

1. sendRequestInternal

else if (data.hasKey(REQUEST_BODY_KEY_STRING)) {
      if (contentType == null) {
        ResponseUtil.onRequestError(
            eventEmitter, requestId, "Payload is set but no content-type header specified", null);
        return;
      }

[lunoob]

I fixed it by commenting a line in the
/android/app/src/debug/java/com/{your-app-name}/ReactNativeFlipper.java
file.
this is only fix that worked for me!

new NetworkingModule.CustomClientBuilder() {
@override
public void apply(OkHttpClient.Builder builder) {
// builder.addNetworkInterceptor(new FlipperOkhttpInterceptor(networkFlipperPlugin));
}
});

good ! this worked for me too. rn version: 0.63.1

[pke]

Is this something new that appeared in a patch release? Because when I started my RN project the same code I have now could connect to the https Server I'm using.

[RahulDutta007]

step1>
add _android:usesCleartextTraffic="true"_ line in AndroidManifest.xml like:

...
android:usesCleartextTraffic="true"> // add this line
...
step2>
Delete all debug folder from your android folder..

Thank you, it works. You're a God

[SUMITIOS]

hey @keyz23 @823844596,
I recently encountered something similar using fetch and formDatas (only on Android though).
The workaround that worked for me was to use XMLHttpRequest instead of fetch.
Hopefully this will help you too!

I don't know if you are using expo but for me this problem started when I updated my expo SDK from 31 to 33 (so RN 0.57.1 to 0.59.8)

The same problem and solution in my case , XMLHttpRequests are working but fetch not. I am not using expo, RN version 0.62.2.

[obendevski]

Hey guys, I had the same problem. I was trying to upload audio .aac file via formData.
For me, i had to prepend the uri part of the formData with file://.

Hope it helps someone.

[the-smart-home-maker]

Based on this code

https://github.com/facebook/react-native/blob/476a336e3613f90b76e3a91d5bffaa098bf4e6ff/ReactAndroid/src/main/java/com/facebook/react/modules/network/NetworkingModule.java#L383

any request without headers content-type and payload body as string will start failing into "Network request failed." this is because the high-level wrappers are handing the Request Error call as "Network request failed." but is not even reaching the internet.

    try {
      sendRequestInternal(
          method,
          url,
          requestId,
          headers,
          data,
          responseType,
          useIncrementalUpdates,
          timeout,
          withCredentials);
    } catch (Throwable th) {
      FLog.e(TAG, "Failed to send url request: " + url, th);
      ResponseUtil.onRequestError(getEventEmitter(), requestId, th.getMessage(), th);
    }
  }

1. sendRequestInternal

else if (data.hasKey(REQUEST_BODY_KEY_STRING)) {
      if (contentType == null) {
        ResponseUtil.onRequestError(
            eventEmitter, requestId, "Payload is set but no content-type header specified", null);
        return;
      }

@jamesjara: Awesome! I just hat to add the "Content-Type" as "multipart/form-data" and "Accept" as "application/json".--> now it works fine

[laurent22]

If that can help anyone, React Native 0.62+ seems to require a "Content-Type" header for certain fetch calls or else you get "Network request failed". More info in this issue: https://github.com/facebook/react-native/issues/30176

[impulse]

android:usesCleartextTraffic="true"

Please avoid doing this.

You are most likely running into this issue because you are trying to develop locally with an emulator and don't have the correct URL (10.0.2.2 is the default for AVD).

import { Platform } from "react-native";
export const API_URL =
  Platform.OS === "ios" ? "http://localhost:4000" : "http://10.0.2.2:4000";

If you need a public URL use https://ngrok.com/ or set up a small VPS with https://certbot.eff.org/

[Powersanth]

its working for me
url should be 10.0.2.2:3000/singup
localhost will not work
if you are sending from real android device
use your pc ip address

[bitfabrikken]

For anyone searching and landing here, I got this error if I feed an array as a value to the FormData object used in the fetch request body.
E.g., pseudocode, how to provoke the "TypeError: Network request failed" error on Android:

var formData = new FormData();
formData.append("test", [10,20,30]);

var res = await fetch("https://google.com",{
    method: "POST",
    headers: {  
        'Accept':       'application/json',
        'Content-Type': 'multipart/form-data',
    },
    body: formData
}).catch((err) => {  
    console.log("caught err",err);
});

Headers do not matter, just that it's a POST request.