miércoles, 4 de diciembre de 2013

INTRODUCCION


En esencia, AJAX permite que una página web que ya ha sido cargada solicite nueva información al servidor. Dicho así, no supondría en realidad ningún invento novedoso. Una página web que contiene un enlace permite que se solicite al servidor nueva información cada vez que se pincha dicho enlace. Una página web que contiene un formulario envía información al servidor y recibe de él nueva información, normalmente la respuesta ante los datos que se han enviado. En ambos casos hay una conexión entre el cliente y el servidor.

¿Cuál es la diferencia cuando usamos AJAX? La diferencia es que con AJAX no es necesario recargar toda la página web, como ocurre cuando pinchamos en un enlace o cuando pulsamos el botón submit de un formulario. Con AJAX es posible realizar una conexión a un servidor desde dentro de una página web usando un programa Javascript. Dicho servidor enviará una respuesta; esta respuesta se almacenará en una variable del programa Javascript y, una vez almacenada en la variable, podremos hacer con ella lo que deseemos.

CONCEPTO



AJAX, acrónimo de Asynchronous JavaScript And XML (JavaScript asíncrono y XML), es una técnica de desarrollo web para crear aplicaciones interactivas o RIA (Rich Internet Applications). Estas aplicaciones se ejecutan en el cliente, es decir, en el navegador de los usuarios mientras se mantiene la comunicación asíncrona con el servidor en segundo plano. De esta forma es posible realizar cambios sobre las páginas sin necesidad de recargarlas, mejorando la interactividad, velocidad y usabilidad en las aplicaciones.
Ajax es una tecnología asíncrona, en el sentido de que los datos adicionales se solicitan al servidor y se cargan en segundo plano sin interferir con la visualización ni el comportamiento de la página. JavaScript es el lenguaje interpretado (scripting language) en el que normalmente se efectúan las funciones de llamada de Ajax mientras que el acceso a los datos se realiza mediante XMLHttpRequest, objeto disponible en los navegadores actuales. En cualquier caso, no es necesario que el contenido asíncrono esté formateado en XML.

Ajax es una técnica válida para múltiples plataformas y utilizable en muchos sistemas operativos y navegadores dado que está basado en estándares abiertos como JavaScript y Document Object Model (DOM).

EL OBJETIVO XMLHTTPREQUEST



XMLHttpRequest (XHR), también referida como XMLHTTP (Extensible Markup Language / Hypertext Transfer Protocol), es una interfaz empleada para realizar peticiones HTTP y HTTPS a servidores Web. Para los datos transferidos se usa cualquier codificación basada en texto, incluyendo: texto plano, XML, JSON, HTML y codificaciones particulares específicas. La interfaz se implementa como una clase de la que una aplicación cliente puede generar tantas instancias como necesite para manejar el diálogo con el servidor.

METODOS

Métodos

abort() – Detiene la petición en curso.
getAllResponseHeaders() – Devuelve todas las cabeceras de la respuesta (etiquetas y valores) como una cadena.
getResponseHeader(etiqueta) – Devuelve el valor de la etiqueta en las cabeceras de la respuesta.
open(método,URL,asíncrona,nombre,password) – Abre una conexión con esa URL mediante ese metodo (GET o POST), aplicando los valores opcionales de la derecha (ahora se explicará).
send(contenido) – Envía el contenido al servidor.
setRequestHeader(etiqueta,valor) – Establece el valor de una etiqueta de las cabeceras de petición.
De está lista nos detendremos en el método open que es uno de los más utilizados y el que nos permitirá utilizar la mejor característica de Ajax que es la carga de datos externos a la página sin necesidad de recargar la misma.
Método Open
El método open prepara una conexión HTTP a través del objeto XMLHttpRequest con un método y una URL especificados.
XMLHttpRequest.open ( sMetodo, sURL [, bSincronia [, sUsuario [, sPwd ] ] ] );
sMetodo es la cadena que nos indicara el tipo de conexión (GET o POST)
sURL es la url a la que realizamos la petición
bSincronia es un campo booleano con el que podemos utilizar modo asíncrono o síncrono, si lo fijamos en “false” modo síncrono perderiamos las mejores características de 
AJAX, los datos sUsuario y sPwd son opcionales y sólo aplicables en caso de caída del servidor.
Al llamar a open el atributo readyState a 1, resetea los headers de envío y los devuelve atributos responseText, responseXML, status y statusText a sus valores iniciales

PROPIEDADES



onreadystatechange – Contiene el nombre de la función que se ejecuta cada vez que el estado de la conexión cambie.
readyState – Estado de la conexión, puede valer desde 0 (no iniciada) hasta 4 (completado).
responseText – Datos devueltos por el servidor en formato cadena.
responseXML – Datos devueltos por el servidor en forma de documento XML que puede ser recorrido mediante las funciones del DOM (getEementsByTagName, etc).
status – Código enviado por el servidor, del tipo 404 (documento no encotrado) o 200 (OK).
statusText – Mensaje de texto enviado por el servidor junto al código (status), para el caso de código 200 contendrá “OK”.

Conocer estas propiedades y métodos es algo muy útil a la hora de desarrollar aplicaciones utilizando Ajax debido a la gran ayuda que muchas de ellas ofrecen a la hora de depurar errores. Y nos da una mayor idea acerca de la potencia de esta conjunción de tecnologías.

SINTAXIS BASICA PARA LOS METODOS


Es aconsejable elegir “GET” para aquellas peticiones en las que se soliciten pocos datos y “POST” para aquellas en las que sea necesario enviar información, especialmente si estos datos podrían superar los 512 bytes en total, puesto que por el método “GET” no podremos recibir la totalidad de los datos.

RESPONSE TEXT



La respuesta puede venir en muchas formas diferentes, como XML, texto plano, (X) HTML o JavaScript Object Notation (JSON). Dependiendo del formato de los datos que recibe, hay dos maneras diferentes de manejar la situación: con responseText o conresponseXML . El responseText método se utiliza para todos los formatos que no están basados ​​en XML. Devuelve una representación exacta de la respuesta como una cadena. Texto sin formato, (X) HTML y JSON son todos los formatos que utilizan responseText .