Making Post request with XML data in Angular 5

Question

I'm am new to angular and using angular 5.

I'm making a http post request and I want to send xml data to backend as my backend only accept data in xml format.

I've followed some tutorials but couldn't get it to work. Please let me know what I'm doing wrong and how can I make it work.

This is how I'm making request.

signin(){
    const headers = new HttpHeaders({responseType: 'text' , 'Content-Type': 'text/xml' }).set('Accept', 'text/xml');
    let body =  '<request>' 
                '<username>Username</username>' 
                '<password>Password</password>' 
                '</request>';
    const hdr = {headers:headers , body:body};
    console.log("Checking:  " , hdr);
    return this.http.post('https://66.128.132.126:8002/?event=account_login' , hdr);
}

Here is my console for this:

And here is my network:

Answer 1

the responseType and body should not be appended with headers. body should be sent separetly and with headers and responseType options object should be formed and sent as a parameter to post.

signin(){
    const headers = new HttpHeaders();
          headers = headers.append('Content-Type', 'text/xml');
          headers = headers.append('Accept', 'text/xml');
    let body =  '<request>' 
                '<username>Username</username>' 
                '<password>Password</password>' 
                '</request>';

    return this.http.post('https://66.128.132.126:8002/?event=account_login',body , { headers: headers, responseType: 'text' });
}

Answer 2

By default Angular CLI made a Preflight Request in order to check CORS: https://developer.mozilla.org/en-US/docs/Glossary/Preflight_request

It seems that you backend isn't handling this request correctly. We need backend info to help you