I want to create a global helper file as most of the page will call to same function but with different parameters. I have try several ways and all did not return the value as if I place the script within the same screen.
I'm testing to get response from SOAP WSDL.
URL: 'http://mytesting.justdummy.com/android.asmx'
Content-Type: text/xml
SOAPAction: http://tempuri.org/GetServerTime
<?xml version="1.0" encoding="utf-8"?>
<soap:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">
<soap:Body>
<GetServerTime xmlns="http://tempuri.org/" />
</soap:Body>
</soap:Envelope>
I have test it using Postman and I get the server time response.
Below is what I currently tried:- Method 1:
const soapAPI= {
fetchSOAPRequest: function (soapFunction, soapBody) {
var xmlhttp = new XMLHttpRequest();
xmlhttp.open('POST', global.valServerURL, true);
// build SOAP request
var soapRequest =
'<?xml version="1.0" encoding="utf-8"?>' +
'<soap:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">' +
'<soap:Body>' +
`<${soapFunction} xmlns="http://tempuri.org/">` +
soapBody +
`</${soapFunction}>` +
'</soap:Body>' +
'</soap:Envelope>';
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4) {
if (xmlhttp.status == 200) {
return xmlhttp.responseText;
}
}
}
// Send the POST request
xmlhttp.setRequestHeader('Content-Type', 'text/xml');
xmlhttp.setRequestHeader('SOAPAction', `http://tempuri.org/${soapFunction}`);
xmlhttp.send(soapRequest);
}
}
export default soapAPI;
Method 2:
export const fetchSOAPRequest = async (soapFunction, soapBody) => {
var xmlhttp = new XMLHttpRequest();
xmlhttp.open('POST', global.valServerURL, true);
// build SOAP request
var soapRequest =
'<?xml version="1.0" encoding="utf-8"?>' +
'<soap:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">' +
'<soap:Body>' +
`<${soapFunction} xmlns="http://tempuri.org/">` +
soapBody +
`</${soapFunction}>` +
'</soap:Body>' +
'</soap:Envelope>';
console.warn(soapRequest);
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4) {
if (xmlhttp.status == 200) {
return xmlhttp.responseText;
}
}
}
// Send the POST request
xmlhttp.setRequestHeader('Content-Type', 'text/xml');
xmlhttp.setRequestHeader('SOAPAction', `http://tempuri.org/${soapFunction}`);
xmlhttp.send(soapRequest);
};
Method 3 from here:
function fetchSOAPRequest(soapFunction, soapBody) {
var xmlhttp = new XMLHttpRequest();
xmlhttp.open('POST', global.valServerURL, true);
// build SOAP request
var soapRequest =
'<?xml version="1.0" encoding="utf-8"?>' +
'<soap:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">' +
'<soap:Body>' +
`<${soapFunction} xmlns="http://tempuri.org/">` +
soapBody +
`</${soapFunction}>` +
'</soap:Body>' +
'</soap:Envelope>';
console.warn(soapRequest);
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4) {
if (xmlhttp.status == 200) {
return xmlhttp.responseText;
}
}
}
// Send the POST request
xmlhttp.setRequestHeader('Content-Type', 'text/xml');
xmlhttp.setRequestHeader('SOAPAction', `http://tempuri.org/${soapFunction}`);
xmlhttp.send(soapRequest);
}
function fetchAnotherAPI(date) {
// your logic
}
export {
fetchSOAPRequest,
};
Method 1 and 2 is on the same '../components/services/soapAPI' file
On main class where the return should happen.
import { fetchSOAPRequest, soapAPI} from '../components/services/soapAPI';
onTestingRetrieve = async () => {
try {
// call from export constant
var myfirst = await fetchSOAPRequest('GetServerTime', '');
// call from object and function
var mysecond = await soapAPI.fetchSOAPRequest('GetServerTime', '');
// call from function within same class file
var mythird = await this.fetchSOAP('GetServerTime', '');
// alert to show response for confirmation only
Alert.alert('Response', JSON.stringify(resp));
} catch (e) {
Alert.alert('Error', 'SOAP request failed!\n' + e);
}
}
//On render
<TouchableOpacity style={styles.buttonContainer} onPress={this.onTestingRetrieve}>
<Text style={styles.buttonText}>Get server time</Text>
</TouchableOpacity>
But if I put the XMLHttpRequest within onTestingRetrieve, it will show the responseText without any problem as below.
onTestingRetrieve = async () => {
try {
const soapFunction = 'GetServerTime';
const soapBody = '';
var xmlhttp = new XMLHttpRequest();
xmlhttp.open('POST', global.valServerURL, true);
// build SOAP request
var soapRequest =
'<?xml version="1.0" encoding="utf-8"?>' +
'<soap:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">' +
'<soap:Body>' +
`<${soapFunction} xmlns="http://tempuri.org/">` +
soapBody +
`</${soapFunction}>` +
'</soap:Body>' +
'</soap:Envelope>';
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4) {
if (xmlhttp.status == 200) {
Alert.alert('Response', xmlhttp.responseText);
}
}
}
// Send the POST request
xmlhttp.setRequestHeader('Content-Type', 'text/xml');
xmlhttp.setRequestHeader('SOAPAction', `http://tempuri.org/${soapFunction}`);
xmlhttp.send(soapRequest);
} catch (e) {
Alert.alert('Error', 'SOAP request failed!\n' + e);
}
}
I have search for tutorial, example and SO question but I still failed to get the server time. Can anyone go through the script and point on which part I'm missing?
