Sobre AJAX

AJAX, acrónimo de Asynchronous JavaScript And XML es una técnica de programación web que pretende hacer que una página web sea más interactiva, rápida y usable.

Básicamente se trata de ejecutar una serie de funcionalidades de JavaScript (principalmente el objeto XMLHttpRequestActiveXObject en IE-) del lado del cliente (navegador web) para lanzar peticiones de manera asíncrona en background al servidor (PHP en el caso de NWiki). Como respuesta a las peticiones del servidor, el navegador recibe los datos encapsulados en formato XML (no es obligatorio, se puede utilizar el formato que se crea conveniente), los procesa y modifica el DOM vía JavaScript para mostrar la información que interese.

Hablando en plata, es una forma de cargar datos desde el servidor sin tener que recargar la página, haciendo que la aplicación web se parezca más a una aplicación de escritorio.

Actualmente la mayoría de navegadores modernos como Mozilla Firefox, Opera, Konqueror/Safari y otros no tan modernos soportan AJAX. Aplicaciones de Google como Google Mail, Google Maps y Google Docs, YouTube, Flickr… usan AJAX para ofrecer una navegación más rápida y cómoda.

A la hora de utilizar AJAX en un proyecto, podemos optar por dos enfoques para el lado del cliente:

  • Programar nosotros el código JavaScript, ya que no requiere muchas líneas de código y no es complejo.
  • Utilizar una librería libre para PHP, que encapsule las funcionalidades y ofrezca alguna extensión que nos pueda ser útil. Las más usadas son:

A nivel de implementación, el flujo de instrucciones en la parte del cliente es más o menos el siguiente:

  • 1. Instanciar el objecto JavaScript: comprobar el navegador para ver si hay que instanciar un XMLHttpRequest o, en caso de detectar un IE, ActiveXObject.
  • 2. Mandar el request utilizando:
    • Método open(): especifica la URL de la página PHP a llamar, y si la petición es por GET o POST.
    • Atributo onreadystatechange: indica qué función JavaScript es la que recogerá el XML de respuesta.
    • Método send(): envía la petición.
  • Función que evalue la respuesta y modifique el DOM pertinentemente.

DOM o Document Object Model es la colección de objetos que crea el navegador al cargar el código (X)HTML de una página web para representar el conjunto de elementos que la componen. Así, lenguajes como JavaScript actúan sobre esos objetos, analizandolos, mofidicandolos, creando nuevos y eliminando otros… para cambiar el aspecto de la página de una manera más óptima que si se trabajara con texto/código (X)HTML directamente.

Anuncios

Una respuesta to “Sobre AJAX”

  1. […] AJAX se pretende cargar todos los tags ya existentes en otras páginas para ofrecer un autocompletado a […]

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s

A %d blogueros les gusta esto: