REST API Post body from XML endpoint URL-CodePudding

I am trying to make a post request to a server(https://exampleapi.com/echo/post/xml) and I have a piece of code that sort of works. What I want to achieve is to have the XML load from the URL https://randomuser.me/api/?format=xml rather than the XML contained in the backticks. Below is my code sample:

var url = "https://exampleapi.com/echo/post/xml";

var xhr = new XMLHttpRequest();
xhr.open("POST", url);

xhr.setRequestHeader("Content-Type", "application/xml");
xhr.setRequestHeader("Accept", "application/xml");

xhr.onreadystatechange = function () {
  if (xhr.readyState === 4) {
    console.log(xhr.status);
    console.log(xhr.responseText);
  }
};

var data = `<user>
<results>
<gender>male</gender>
<name>
<title>Mr</title>
<first>Jasper</first>
<last>Smith</last>
</name>
<location>
<street>
<number>1966</number>
<name>Chatham Road</name>
</street>
<city>Dunedin</city>
<state>Canterbury</state>
<country>New Zealand</country>
<postcode>63789</postcode>
<coordinates>
<latitude>66.6618</latitude>
<longitude>-110.4640</longitude>
</coordinates>
<timezone>
<offset>-10:00</offset>
<description>Hawaii</description>
</timezone>
</location>
<email>[email protected]</email>
<login>
<uuid>8a132229-407b-47db-9a03-73c5d6c8c969</uuid>
<username>angryelephant526</username>
<password>nicole1</password>
<salt>saEREYSt</salt>
<md5>4292d6c17f10dad0224746c16f510032</md5>
<sha1>43d82fdd05fe62edcec774d534aaa41dde6c32dd</sha1>
<sha256>891f6c6f1193b59d70fd61c482575c9c04fa951123ec081e459b2a46235e1694</sha256>
</login>
<dob>
<date>1955-01-13T12:46:36.403Z</date>
<age>66</age>
</dob>
<registered>
<date>2015-08-05T20:56:20.380Z</date>
<age>6</age>
</registered>
<phone>(847)-575-4692</phone>
<cell>(051)-964-8266</cell>
<id>
<name/>
<value/>
</id>
<picture>
<large>https://randomuser.me/api/portraits/men/34.jpg</large>
<medium>https://randomuser.me/api/portraits/med/men/34.jpg</medium>
<thumbnail>https://randomuser.me/api/portraits/thumb/men/34.jpg</thumbnail>
</picture>
<nat>NZ</nat>
</results>
<info>
<seed>9dca58235eff2b2b</seed>
<results>1</results>
<page>1</page>
<version>1.3</version>
</info>
</user>`;

xhr.send(data);

CodePudding user response：

You can make multiple AJAX requests, one after the other.

Here is an example where xhr1 makes a GET request to the first url and xhr2 makes a POST request to the second url with the data from xhr1.

const xhr1 = new XMLHttpRequest();
xhr1.open('GET', "https://randomuser.me/api/?format=xml");
xhr1.setRequestHeader("Accept", "application/xml");

xhr1.onload = function() {
  xhr2.send(xhr1.responseXML); // get the data from xhr1 and send in xhr2
}

const xhr2 = new XMLHttpRequest();
xhr2.open('POST', "https://exampleapi.com/echo/post/xml");
xhr2.setRequestHeader("Content-Type", "application/xml");
xhr2.setRequestHeader("Accept", "application/xml");

xhr2.onload = function() {
  console.log(xhr2.responseXML); // get the data from xhr2 and log it
}

xhr1.send();

You could alternatively use fetch:

fetch("https://randomuser.me/api/?format=xml", { method: "GET", headers: { 'Accept': 'text/xml' } }).then(res => res.text()).then(data => {
  fetch("https://exampleapi.com/echo/post/xml", { method: "POST", headers: { 'Content-Type': 'text/xml', 'Accept': 'text/xml' }, body: data }).then(res => res.text()).then(console.log);
})