Ionic native http post formdata

I have been trying to send formdata through my ionic application. Native http is establishing the connection with server but I am unable to send formdata. I have tried angular HttpClient and xmlHttpRequest but they are unable to establish connection to the server.

I have tried setting proxy in ionic.config.json, but that didnt work either.
I have set <allow-navigation href="*" /> in config.xml and <meta http-equiv="Content-Security-Policy" content="script-src * 'unsafe-inline' 'unsafe-eval'"> in index.html
I have removed and added the cordova whitelist plugin
But nothing seems to work.
I now get and internal server error with response status : 500

my ionic.config.json:

{
  "name": "app",
  "integrations": {
    "cordova": {}
  },
  "type": "ionic-angular",
  "proxies": [{
        "path": "/api",
        "proxyUrl": "https://myurl.com/"
    }]
}

ionic native http:

this.http.post('/api',formData , {headers:headers})
.then(res=>alert("http res: "+JSON.stringify(res)))
.catch(err=>alert("http err: "+JSON.stringify(err)))

I am not sending any data through angular httpClient or xhr request since I am trying to work with them to establish connection first.

angular httpClient:

this.httpClient.post('/api',{} , {}).subscribe(
          res=>{
              console.log("response : "+JSON.stringify(res));
          },
          err=>{
              console.log("send error : "+JSON.stringify(err))
          });

xhr request:

var xhr = new XMLHttpRequest();
xhr.open('POST', https://myurl.com/);
xhr.onload = function() {
                  if (xhr.status != 200) { 
                    alert(`Error ${xhr.status}: ${xhr.statusText}`); 
                  } else { // show the result
                    alert(`Done, got ${xhr.response.length} bytes`);
                  }
                };
                
xhr.onerror = function(e) {
     alert(JSON.stringify(e));
 };
 xhr.send();

my formdata entry structure is (key,blobFile,filename)
current error:

{"headers":{"normalizedNames":{},"lazyUpdate":null},"status":500,"statusText":"Internal Server Error","url":"http://localhost:8100/api","ok":false,"name":"HttpErrorResponse","message":"Http failure response for http://localhost:8100/api: 500 Internal Server Error","error":"<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n<meta charset=\"utf-8\">\n<title>Error</title>\n</head>\n<body>\n<pre>Error: getaddrinfo ENOTFOUND myurl.com myurl.com:443<br> &nbsp; &nbsp;at GetAddrInfoReqWrap.onlookup [as oncomplete] (dns.js:57:26)</pre>\n</body>\n</html>\n"}

I am not able to understand the issue and resolve it
It would have been much simpler if I could send formdata through native http.