Scripter: Ajax - XMLHttpRequest

De Vocalcom.latam Wiki
Saltar a: navegación, buscar

Para consumir un servicio web desde Hermes usaremos métodos de Ajax como se explica a continuación.

Para enviar una solicitud a un servidor, se utilizan los métodos open() y send() del objeto XMLHttpRequest:

Open:
Especifica el tipo de solicitud, la dirección, y si la solicitud debe ser manejada de forma asíncrona o no.

Sintaxis: open(método,url,async) método : el tipo de petición: GET o POST url : la dirección del webservice async : true (la petición se realiza de modo asincrónica) o false (la petición se realiza de modo sincrónica) NOTA: Nosotros usaremos el método POST ya que debemos enviar el XML con la petición al servicio web.


Send:
Envía la petición al servidor.

Sintaxis: send(string) string: usado unicamente para las peticiones por método POST. Nosotros usaremos este parámetro para enviar la petición al servicio web en formato XML.


Respuesta:
Para obtener la respuesta del servidor, utilizamos las propiedades responseText o responseXML del objeto XMLHttpRequest. responseText captura la respuesta en forma de cadena de texto mientras que responseXML lo hace en forma de documento XML. Esta útima propiedad es la que utilizaremos nosotros.

Una vez capturado el XML de respuesta utilizaremos los métodos y propiedades nativos de JavaScript para navegar por el mismo. El código que tenemos a continuación es un ejemplo básico pero adaptable.

// Obtener variables del formulario
$anio = @anio.value;
$mes = @mes.value;
$dia = @dia.value;
 
// Iniciar conexión con el WebService
if (window.XMLHttpRequest)
{// Para IE7+
   $xmlhttp=new XMLHttpRequest();
}
else
{// Para IE6, IE5
   $xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
$xmlhttp.open('POST', 'http://asp.vocalcom.com.ar/mywebservice/mywebservice.asmx', true);
 
// Crear la petición SOAP
$sr =  '<?xml version=\'1.0\' encoding=\'utf-8\'?> ';
$sr += '<SOAP-ENV:Envelope xmlns="" ';
$sr += 'xmlns:xsd="http://www.w3.org/2001/XMLSchema" ';
$sr += 'xmlns:soap="http://schemas.xmlsoap.org/wsdl/soap/" ';
$sr += 'xmlns:tm="http://microsoft.com/wsdl/mime/textMatching/" ';
$sr += 'xmlns:soapenc="http://schemas.xmlsoap.org/soap/encoding/" ';
$sr += 'xmlns:mime="http://schemas.xmlsoap.org/wsdl/mime/" ';
$sr += 'xmlns:tns="http://tempuri.org/" ';
$sr += 'xmlns:s="http://www.w3.org/2001/XMLSchema" ';
$sr += 'xmlns:soap12="http://schemas.xmlsoap.org/wsdl/soap12/" ';
$sr += 'xmlns:http="http://schemas.xmlsoap.org/wsdl/http/" ';
$sr += 'xmlns:wsdl="http://schemas.xmlsoap.org/wsdl/" ';
$sr += 'xmlns:SOAP-ENV="http://schemas.xmlsoap.org/soap/envelope/" ';
$sr += 'xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"> ';
$sr += '<SOAP-ENV:Body> ';
$sr += '<GetAge xmlns="http://tempuri.org/"> ';
$sr += '<year>' + $anio + '</year> ';
$sr += '<month>' + $mes + '</month> ';
$sr += '<day>' + $dia + '</day> ';
$sr += '</GetAge> ';
$sr += '</SOAP-ENV:Body> ';
$sr += '</SOAP-ENV:Envelope> ';
 
// Esperar y mostrar respuesta
$xmlhttp.onreadystatechange = function () {
    if ($xmlhttp.readyState == 4) {
        if ($xmlhttp.status == 200) {
            //La siguiente linea depende mucho de la versión del navegador
            $resultado = $xmlhttp.responseXML.getElementsByTagName("GetAgeResult")[0].childNodes[0].nodeValue;
            alert($resultado);
        }
    }
}
// Enviar petición
$xmlhttp.setRequestHeader('Content-Type', 'text/xml');
$xmlhttp.send($sr);