Si tenemos que describir la Web 2.0 estoy seguro que no podríamos obviar la palabra AJAX. Y es que podríamos decir que la Web 2.0 se sustenta sobre un modelo tecnológico asíncrono, el cual, mediante peticiones/respuesta para regenerar parte de la página busca dar un efecto de mayor velocidad al usuario final. Al menos, mayor que la recarga entera de la página. «Pure AJAX«.
Y si hablamos de AJAX tenemos que hablar del objeto XMLHttpRequest, sobre el cual nos apoyamos para realizar las peticiones asíncronas desde la página web.
Una de las posibilidades que nos ofrece este objeto es la de conocer la información de la cabecera http. Para ello tenemos los métodos .getAllResponseHeaders() o .getResponseHeader(etiqueta). El primero nos dará toda la información de la cabecera y el segundo nos permitirá ir a buscar un valor en concreto.
Un ejemplo de esta respuesta sería el siguiente:
Microsoft-IIS/5.0 Date: Sat, 10 Jun 2006 17:12:29 GMT Content-Length: 43 Content-Type: text/xml Cache-Control: private
El uso de estas cabeceras puede ser de lo más variopinto y va desde la validación de las ultimas modificaciones del recurso para ver si es válido o no, control de la cache o del contenido de la respuesta,….
Para poder recuperar las cabeceras lo primero que tenemos que hacer es crear un objeto XMLHttpRequest. A la hora de cargar un objeto XMLHttpRequest lo podremos hacer de dos formas. Mediante el propio objeto XMLHttpRequest o bien mediante un ActiveX para mantener compatibilidad con IE5 e IE6.
req = false;
// Llama objeto XMLHttpRequest
if (window.XMLHttpRequest) {
req = new XMLHttpRequest();
if (req.overrideMimeType) {
req.overrideMimeType('text/xml');
}
// Si no funciona intenta utiliar el objeto IE/Windows ActiveX
} else if (window.ActiveXObject) {
req = new ActiveXObject("Microsoft.XMLHTTP");
}
Una vez que tenemos el objeto XMLHttpRequest instanciado deberemos de indicar cual es el método de callback, es decir, que método va a atender la respuesta. Esto lo hacemos mediante el atributo onreadystatechange.
Lo siguiente será llamar al método open, para indicarle los parámetros de conexión: método de envío, URL destino,…
Recuerda que la URL destino del método open tiene que estar en tu mismo dominio. En caso contrario no podrás acceder al contenido de dicha URL.
Por último llamaremos al método send. El cual realizará la conexión.
if(req){
req.onreadystatechange = procesarRespuesta;
req.open('GET', url, true);
req.send(null);
}
Cuando procesemos la respuesta simplemente tendremos que llamar al método .getAllResponseHeaders() o .getResponseHeader(etiqueta)
Debemos de recordar que para procesar la respuesta es una buena práctica que la petición ha terminado
if (req.readyState == 4)
Y que la respuesta del servidor ha sido un OK. Es decir, un código de status 200.
if (req.status == 200)
Una vez hechas todas las validaciones y en nuestro caso vamos a volcar las cabeceras en un área de texto.
sTexto = document.getElementById("texto").value;
if (req.readyState == 4) {
texto = texto + "Respuesta Procesada...\n";
texto = texto + req.getAllResponseHeaders();
texto = texto + "Estado de la petición: " + req.status + "\n";
document.getElementById("texto").value = texto;
}
