Saltar al contenido principal

Arquitectura web 2.0 interactiva

AJAX​

AJAX (Asynchronous JavaScript And XML), é unha técnica de desenvolvemento web para crear aplicacións web asíncronas. Estas aplicacións execútanse no cliente, é dicir, no navegador dos usuarios mentres se mantén a comunicación asíncrona co servidor nun segundo plano.

Deste xeito é posible interactuar co servidor sen necesidade de recargar a páxina web, mellorando tanto na velocidade, interactividade e usabilidade das aplicacións.

DOM

DOM (Document Object Model) é unha interface de programación que nos permite crear, modificar ou eliminar elementos dun documento HTML. Tamén podemos agregar eventos a ditos elementos para facer máis dinámica a nosa páxina web.

O seu funcionamento podemos describilo do seguinte xeito:

  1. O navegador web realiza unha petición HTTP web a un servidor.
  2. O servidor web envía a resposta HTTP cun documento HTML no corpo. Este documento contén a parte de código HTML, código CSS e Javascript incrustrado (Non ten porque ser así, pero para simplificar o proceso. Podería estar nun ficheiro enlazado).
  3. O navegador web renderiza o documento HTML.
  4. O código Javascript (ou outra linguaxe de lado cliente) incrustado na web realiza unha nova petición HTTP ao servidor web tras a intervención ou non do usuario. Esta petición pode levar un obxecto JSON no corpo da petición. Non é obrigatorio que leve.
  5. O servidor web envía unha resposta HTTP cun ficheiro XML ou JSON no corpo da resposta. Esta resposta é xerada do mesmo xeito que na arquitectura 2.0.
  6. O código Javascript (ou outra linguaxe de guión de lado cliente) que realizou a petición HTTP procesa a información obtida no XML ou JSON e modifica o DOM da web sen recargar a páxina para mostrar a información enviada polo servidor.

O proceso de peticións HTTP por parte de Javascript pode seguir de xeito indefinido, ata que se desexe cargar unha nova web e o proceso comezará dende o principio.

Patrón MVC con AJAX​

Nunha arquitectura na que se utiliza AJAX, o funcionamento cando se realiza a primeira petición é similar a arquitectura tradicional. Pero cando se realiza unha chamada AJAX, o funcionamento é o seguinte: