Index

AJAX Basico

Definiciones, Participantes, XMLHttpRequest

1.Introduccion a AJAX

1.1. RIA y WEB 2.0

2. Como funciona AJAX

2.1. En AJAX interviene

2.2. El Objeto XMLHttpRequest

Basico

AJAX Basico

Introduccion a AJAX

AJAX = Asynchronous JavaScript and XML Aparece en 2005, no se trata de una nueva tecnología, como veremos mas adelante, sino de un conjunto de tecnologias que permite el funcionamiento asincrono de peticiones dentro de una pagina web. El concepto esta intimamente ligado a WEB 2.0, y RIA.

 RIA y Web 2.0

AJAX = Asynchronous JavaScript and XML

Aparece en 2005, no se trata de una nueva tecnología, como veremos mas adelante, sino de un conjunto de tecnologias que permite el funcionamiento asincrono de peticiones dentro de una pagina web. El concepto esta intimamente ligado a WEB 2.0, y RIA.

Como funciona AJAX

Primero lo descompondremos en cada una de sus tecnologias, veremos que se basa principalmente en el objeto XMLHttpRequest, el cual nos permite el funcionamiento de peticiones asincronas dentro de un objeto DOM.

En AJAX interviene

Tecnologia Cliente

Web Browser
DOM  
CSS  (manejo de la presentacion)
JavaScript (ECMAScript standard 1.2)
XMLHttpRequest
JSON

Tecnologia Servidor

Servidor/Contendor Web por ejemplo LAMP, Apache Tomcat

En una aplicacion Web no Ajax, el contenido de la vista que muestra nuestro navegador, se actualiza entero tras realizar, una peticion ya sea GET o POST a cada respuesta. Sin embargo perdemos dinamismo y rendimiento a cada recarga del documento. Ajax nos permite que las peticiones correspondan a fragmentos del documento las cuales pueden ser manejadas de forma separada.

El Objeto XMLHttpRequest

1-Se lanza un evento en el navegador.
2- Se crea el objeto XHR.
3- Se configura el objeto XHR creado.
4- Se ejecuta la peticion XHR de manera asincrona.
5- El servidor devuelve un documento del Mime/Type indicado como respuesta.
6- El objeto XHR ejecuta la funcion  CallBack  y procesa el resultado.
7- El cliente se actualiza con el resultado (HTML, DOM).

Estados de XMLHttpRequest

0 – sin inicializar, el método open() no se ha ejecutado.
1 – inicializado, el método open() se ha ejecutado.
2 – cargado, el método send() se ha ejecutado.
3 – interactivo, el servidor está enviando datos.
4 – completada, el servidor a terminado de enviar los datos.

Basico