35

XMLHttpRequest

XMLHttpRequest es un objeto Javascript que incorpora la misma funcionalidad que el objeto originalmente desarrollado por Microsoft. Nos da una forma sencilla de obtener datos de una url. Aunque el nombre pueda despistar, XMLHttpRequest puede ser usado para obtener cualquier tipo de dato, no sólo XML.

Requiere importarla previamente a su uso:

importClass ( "XMLHttpRequest" );

Si la clase la vamos a usar en un script de QML el nombre del objeto ha de ser VXMLHttpRequest.

Si no hacemos import, haremos uso de la implementación del propio motor de JavaScript, que tiene su propio XMLHttpRequest, que funciona según esta documentación.

Para el acceso mediante proxy, esta clase accederá a Internet con la configuración Proxy del sistema.

También podremos establecer una configuración diferente en caso de que lo necesitemos. En este caso, debemos configurar en el registro correspondiente a la rama del cliente una rama proxy, con los siguientes valores de cadena:

enabled: true para habilitar, false para deshabilitar la configuraicón.

hostName: Dominio o ip del proxy.

port: Puerto del proxy.

userName: Usuario del proxy.

password: Contraseña del proxy.

type: 0 = socket5, 1 = http

En Windows, por ejemplo en:

HKEY_CURRENT_USER\Software\Velneo\vClient\proxy

En Linux en:

/home/usuario/.config/Velneo/vClient.conf

En Mac en:

~/Library/Preferences/com.velneo.vclient.plist

Indice de propiedades

Number errorCode

Number readyState

Variant response

String responseText

String responseType

Number status

String statusText

Number timeout

Indice de funciones

Constructor

XMLHttpRequest XMLHttpRequest()

Generales

void abort()

String getAllResponseHeaders()

String getResponseHeader( String name )

void open( String method, String url, bool async = true, String username = "", String password = "" )

void send( String data )

void send( VByteArray data )

void send()

void setRequestHeader( String name, String value )

bool setClientCertificate( String certificado, String key[, String password] )

bool setClientCertificate( VSSLCertificate sslCertificate )

void setPeerVerifyMode( mode )

Auxiliares

void processEvents()

void waitForRequestComplete()

Señales

onreadystatechange

ontimeout

Enumeraciones

Modos de validación de certificado

VerifyNone: no solicitará un certificado al peer. Puede establecer este modo si no estás interesado en la identidad del otro lado de la conexión. La conexión seguirá estando encriptada, y tu socket seguirá enviando su certificado local al peer si es solicitado.

QueryPeer: solicitará un certificado al peer, pero no requiere que este certificado sea válido. Esto es útil cuando se quieren mostrar los detalles del certificado del par al usuario sin afectar al handshake SSL real. Este modo es el predeterminado para los servidores. Nota: En Schannel este valor actúa igual que VerifyNone.

VerifyPeer: solicitará un certificado al peer durante la fase de handshake SSL, y requiere que este certificado sea válido. Si falla, emitirá la señal de error de SSL. Este modo es el predeterminado para los clientes.

AutoVerifyPeer: es el modo por defecto. Utilizará automáticamente QueryPeer para los sockets del servidor y VerifyPeer para los sockets del cliente.

Documentación de propiedades

errorCode

Retorna un entero indicando el error que se ha producido.

Ver códigos de error.

readyState

Retorna un entero indicando el estado de la petición.

0 = UNSENT Todavía no se ha llamado a open().

1 = OPENED send() ha sido llamada.

2 = HEADERS_RECEIVED send() ha sido llamada, y tanto las cabeceras como el estado están disponibles.

3 = LOADING Descargando. La propiedad responseText contiene datos parciales

4 = DONE La operación se ha completado.

response

Retorna un arraybuffer, un objeto Javascript o una cadena, dependiendo del valor de responseType.

El tipo arraybuffer se trata como un VByteArray.

Contiene el cuerpo completo de la respuesta. Es nulo si la petición no pudo completarse o es incompleta.

responseText

Retorna una cadena conteniendo la cadena de respuesta retornada por el servidor HTTP.

A diferencia de la propiedad status, esta incluye el texto completo del mensaje de respuesta (por ejemplo "200 OK")

responseType

Puede retornar uno de los siguientes valores:

"" String (Valor por defecto)

"arraybuffer" VByteArray

"json" Objeto javascript, parseado desde una cadena JSON retornada por el servidor.

status

Retorna el estado de la respuesta de la petición.

Esto es el código del resultado HTTP (por ejemplo, retorna 200 para una petición correcta)

statusText

Devuelve la cadena de respuesta. A diferencia de status, incluye el texto completo del mensaje de respuesta.

timeout

Representa el número de milisegundos que una petición puede tomar antes de ser automáticamente terminada.

Si no se especifica ningún valor, se define como valor por defecto 30 minutos.

Documentación de funciones

Constructor

XMLHttpRequest XMLHttpRequest()

Requiere importar previamente la clase:

importClass ( "XMLHttpRequest" );

Funciones generales

void abort()

Aborta la petición si ya ha sido enviada.

String getAllResponseHeaders()

Retorna todas las cabeceras de respuesta como una cadena, o vacío si no se han recibido.

String getResponseHeader( String name )

Retorna una cadena conteniendo el texto de la cabecera indicada en name, o vacío tanto si la respuesta no ha sido recibida o si la cabecera indicada no existe en la respuesta.

Parámetros:

  • name: Nombre de la cabecera.

void open( String method, String url, bool async = true, String username = "", String password = "" )

Inicia una petición

Parámetros:

  • method: El método HTTP a usar, tal como GET, POST, etc.

  • url: La url a la que se envía la petición.

  • async: Un valor booleano opcional, por defecto true, que indica si realizar o no la operación de forma asíncrona. Si este valor es falso, la función send() no retorna hasta que la respuesta es recibida. Si el valor es true, la notificación de que la transacción se ha completado se sabe usando la propiedad readyState (en este caso hay que mantener el proceso javascript abierto "entreteniendolo". Mirar ejemplo).

  • user: Valor opcional pasa usar en la autenticación. Por defecto es una cadena vacía. Usa el método de autenticación basado en URL.

  • password: Valor opcional pasa usar en la autenticación. Por defecto es una cadena vacía. Usa el método de autenticación basado en URL.

void send( String data )

Envía la petición. Si la petición es síncrona, no retorna hasta que llega la respuesta.

Parámetros:

  • data: cadena con los datos que son enviados con la petición. Es convertida a UTF8 antes del envio.

Si la petición es asíncrona, esta función retorna inmediatamente y hay que "entretener" al proceso javascript que la ha llamado hasta que llegue la respuesta (ver ejemplo).

void send( VByteArray data )

Envía la petición. Si la petición es síncrona, no retorna hasta que llega la respuesta.

Parámetros:

  • VByteArray data: VByteArray con los datos que son enviados con la petición.

Si la petición es asíncrona, esta función retorna inmediatamente y hay que "entretener" al proceso javascript que la ha llamado hasta que llegue la respuesta (ver ejemplo).

void send()

Envía la petición.

Si la petición es síncrona, no retorna hasta que llega la respuesta. Si la petición es asíncrona, esta función retorna inmediatamente y hay que "entretener" al proceso javascript que la ha llamado hasta que llegue la respuesta (ver ejemplo).

void setRequestHeader( String name, String value )

Establece el valor de la cabecera en una petición HTTP. Se debe llamar a setRequestHeader() después de open() pero antes de send().

Parámetros:

  • name: Cadena con el nombre de la cabecera.

  • value: Valor de la cabecera.

Si esta función es llamada varias veces con la misma cabecera, los valores son mezclados en una sola cabecera.

bool setClientCertificate( String certificado, String key[, String password] )

Establece el certificado del cliente previamente a la llamada. Parámetros:

  • certificado: cadena en formato PEM que contiene el certificado.

  • key: cadena que contiene la llave privada.

  • password (opcional): cadena que contiene la contraseña de la llave.

Esta función es funcional en Windows y en Linux pero no en Mac OS, dado que, al contrario que en Windows y Linux que usan Open SSL, Mac usa un sistema propio llamado Secure Transport SSL, y esta función del API no es funcional con dicho sistema.

bool setClientCertificate( VSSLCertificate sslCVSSLCertificate sslCertificate )

Retorna si ha conseguido establecer el certificado correctamente(1) o no (0).

Parámetros:

  • VSSLCertificate sslCertificate: objeto de la clase VSSLCertificate con el cetificado SSL.

Esta

void setPeerVerifyMode( mode )

Establece el modo de verificación del socket. Este modo decide si debe solicitar un certificado al par (es decir, el cliente solicita un certificado al servidor, o el servidor solicita un certificado al cliente), y si debe exigir que este certificado sea válido.

El modo por defecto es AutoVerifyPeer, que indica que utilice VerifyPeer para los clientes y QueryPeer para los servidores.

Establecer este modo después de que la encriptación haya comenzado no tiene ningún efecto en la conexión actual.

Parámetros:

  • mode: modo de verificación. Ver enum de modos de validación de certificado.

Ejemplo:

setPeerVerifyMode( XMLHttpRequest.VerifyNone )

Funciones auxiliares

void processEvents()

Procesa los eventos que haya en la cola de la aplicación. Debe usarse cuando realicemos una conexión asíncrona para permitir el proceso de los eventos durante el tiempo que dure.

void waitForRequestComplete()

Espera a que la petición se haya procesado. Hay que usar esta función obligatoriamente cuando se realice la petición desde tercer o cuarto plano (ver ejemplos).

Ejemplos

Obtener contenido de url de forma síncrona

importClass("XMLHttpRequest");

var url="https://velneo.es";

var xhr = new XMLHttpRequest();
xhr.open("GET", url, false);
xhr.send();

if ( (xhr.errorCode==0) && (xhr.status == 200) ) {
    alert(xhr.response);
}

Obtener contenido de url de forma asíncrona

importClass("XMLHttpRequest");

var url="https://velneo.es";

var xhr = new XMLHttpRequest();
xhr.open("GET", url, true);
xhr.send();

// Al ser una llamada asíncrona, esperamos a que la petición termine. Esto es obligatorio si este código se ejecuta en tercer plano. Tenemos dos opciones para ello:

// Opcion 1: Hacemos uso de processEvents para poder mostrar o guardar información mientras esperamos
while(xhr.readyState != 4) { // 4: Done
    xhr.processEvents();
}


// Opcion 2: Hacemos uso de waitForRequestComplete(). Esa instrucción espera hasta que la conexión termine
xhr.waitForRequestComplete();

if ( (xhr.errorCode==0) && (xhr.status == 200) ) {
    alert(xhr.response);
}

Obtener contenido de url de forma asíncrona a través de proxy

importClass("XMLHttpRequest");

// Datos para la conexión
var proxy = "http://127.0.0.1:8080/";
var senda = "helix/"
var host="www.perforce.com";

// Datos de autentificación del proxy
var datosAcceso = new VByteArray();
datosAcceso.setText('usuario:contraseña');
datosAcceso = datosAcceso.toBase64();

// Preparamos y enviamos
var xhr = new XMLHttpRequest();
xhr.open("GET", proxy + senda, true);
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xhr.setRequestHeader('Proxy-Authorization', 'Basic ' + datosAcceso.toLatin1String() );
xhr.setRequestHeader('Host', host );
xhr.send();

// Al ser una llamada asíncrona, esperamos a que la petición termine
while(xhr.readyState != 4) { // 4: Done
    xhr.processEvents();
}

// Mostramos el resultado
if ( (xhr.errorCode==0) && (xhr.status == 200) ) {
    alert( xhr.response );
}

Obtener una imagen y convertirla a Base64 para guardarla en una tabla

importClass("XMLHttpRequest");


var url="http://velneo.es/wp-content/themes/pagelines-infovelneo/imagenes/logotipo-2.png";

var xhr = new XMLHttpRequest();
xhr.open("GET", url, false);
xhr.responseType = "arraybuffer";
xhr.send();

var respuesta="";
if (xhr.errorCode==0) {
    if (xhr.responseType=="arraybuffer") {
        // Obtenemos el array de respuesta
        var respuestaBA = new VByteArray();
        respuestaBA = xhr.response;
        respuesta = respuestaBA.toBase64().toLatin1String();
    } else
        respuesta = xhr.response;
}

Petición incorrecta: obtener contenido de statusText

// Obtener contenido de statusText cuando haces una petición incorrecta

importClass("XMLHttpRequest");

var url="http://httpstat.us/400"
var xhr = new XMLHttpRequest();
xhr.open("GET", url, false);
xhr.send();

if ( (xhr.errorCode==0) && (xhr.status == 200) )
{
    if (xhr.responseType=="arraybuffer")
    {
        // Obtenemos el array de respuesta var respuestaBA = new VByteArray(); respuestaBA = xhr.response;
         respuesta = respuestaBA.toBase64().toLatin1String().substring(0,30);
    }
    else
        respuesta = xhr.response;
    alert("Elemento 1: " + xhr.statusText + " " + respuesta);
}
else
    alert("Status: " + xhr.status + "Status text: " + xhr.statusText + "Error: " + xhr.errorCode);

Petición POST enviando un JSON y obteniendo un JSON

importClass("XMLHttpRequest");

var url="http://validate.jsontest.com";
var jsonAValidar = '{"Nombre": "Luis", "Edad": 43}';

var xhr = new XMLHttpRequest();
xhr.open("POST", url, true);
xhr.responseType = "json"; // Para que la respuesta sea un objeto Javascript Json
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xhr.send('json='+JSON.stringify(jsonAValidar));


// Al ser una llamada asíncrona, esperamos a que la petición termine
while(xhr.readyState != 4) { // 4: Done
    xhr.processEvents();
}

if ( (xhr.errorCode==0) && (xhr.status == 200) ) {
    alert(JSON.stringify(xhr.response));
}

Petición POST enviando un fichero XML con firma de certificado de cliente

importClass("XMLHttpRequest");
importClass( "VFile" );

var fi = new VFile( "/home/usuario/Desarrollo/sii/factura_ejemplo_velneo_2.xml" );
var contenido = "";
if ( fi.open( VFile.OpenModeReadOnly ) )
    contenido = fi.readAll();    

var certificadoFile = new VFile( "/home/usuario/Desarrollo/sii/velneo.pem" );
var contenidoCertificado = "";
if ( certificadoFile.open( VFile.OpenModeReadOnly ) )
    contenidoCertificado = certificadoFile.readAll();    

var keyFile = new VFile( "/home/usuario/Desarrollo/sii/velneo_key.pem" );
var keyCertificado = "";
if ( keyFile.open( VFile.OpenModeReadOnly ) )
    keyCertificado = keyFile.readAll();    

var url = "https://www7.aeat.es/wlpl/SSII-FACT/ws/fe/SiiFactFEV1SOAP";

var xhr = new XMLHttpRequest();
xhr.open("POST", url, true);
xhr.setClientCertificate(contenidoCertificado.toLatin1String(),keyCertificado.toLatin1String());

xhr.setRequestHeader('Content-Type: ', 'text/xml;charset=UTF-8');
xhr.send(contenido);

while(xhr.readyState != 4) 
{
    xhr.processEvents();
}

if ( (xhr.errorCode==0) && (xhr.status == 200) ) 
{
    alert(JSON.stringify(xhr.response));
}

Petición con autenticación usando el método BASIC

importClass("XMLHttpRequest");

// Datos para la conexión
var server = "http://127.0.0.1:8080/";
var senda = "helix/"

// Datos de autentificación del proxy
var datosAcceso = new VByteArray();
datosAcceso.setText('usuario:contraseña');
datosAcceso = datosAcceso.toBase64();

// Preparamos y enviamos
var xhr = new XMLHttpRequest();
xhr.open("GET", server + senda, true);
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xhr.setRequestHeader('Authorization', 'Basic ' + datosAcceso.toLatin1String() );
xhr.send();

// Al ser una llamada asíncrona, esperamos a que la petición termine
while(xhr.readyState != 4) { // 4: Done
    xhr.processEvents();
}

// Mostramos el resultado
if ( (xhr.errorCode==0) && (xhr.status == 200) ) {
    alert( xhr.response );
}

Última actualización