Página 1 de 5
Requisitando Servidor Web Assincronamente
usando Ajax (Objeto XMLHttpRequest)
Introdução
Guarde bem a frase: “O navegador web hospeda uma aplicação, não conteúdo”. Em uma aplicação web clássica, o
navegador não sabe nada sobre as ações que o usuário executou até o momento. Todas as informações são
armazenadas em uma sessão do usuário, localizada no servidor web. Quando o usuário entra em um site ou inicia
uma sessão, vários objetos são criados no lado do servidor. Em seguida, o servidor web envia ao navegador a página
inicial com códigos HTML e outros dados. Sempre que o usuário interage com o site, o navegador envia uma
requisição ao servidor web, que responde à solicitação do navegador com um outro documento. O que o navegador
faz? Bem, o navegador simplesmente retira o documento atual e exibe o novo documento, mesmo que os dois
documentos sejam muito semelhantes. Isso ocorre porque toda a lógica da aplicação está no lado do servidor web.
Em uma aplicação Ajax, parte da lógica da aplicação é movida do servidor web para o navegador. A grande idéia é a
de que o documento que chega no navegador web (lado cliente) torne-se parte da aplicação, permanecendo com ele
por toda a sessão. Assim, é possível que essa parte da aplicação, que está no lado do cliente, tenha a capacidade de
decidir se serão manipuladas no lado cliente ou no lado servidor, ou ainda uma combinação das duas, permitindo
que o navegador armazene dados sobre o estado da aplicação. Sendo assim, esse documento mostrará como realizar
requisições assíncronas a um servidor web permitindo realizar requisições para executar diversas operações no
servidor de modo que o usuário receba respostas que sejam inseridas dinamicamente em sua página web, sem que,
por exemplo, essa página seja recarregada por uma nova página.
O Servidor Web fornece dados, não conteúdo
Quando o navegador (lado cliente) faz uma requisição, o servidor retorna uma página inteira. O objetivo de realizar
uma requisição assíncrona ao servidor web é permitir que o servidor retorne apenas as informações que são do
interesse do usuário, ou seja, retornar algumas informações que podem ser inseridas na página atual do usuário, via
modelo DOM, estudado no documento anterior. Com esse novo modelo de requisição-resposta, evitamos que sejam
reenviados ao navegador todos os conteúdos e códigos que não sofreram modificações. Por isso, o servidor deve
retornar dados em vez de conteúdos. Assim, podemos reduzir a quantidade de informações que chega ao navegador
cliente, priorizando a transferência dos dados mais importantes e essenciais à página atual do usuário. Em uma
aplicação que utiliza Ajax, temos menos tráfego ao longo da navegação por parte do usuário cliente, ocorrendo
maior tráfego apenas no início, quando o usuário inicia sua navegação em um determinado site. As comunicações
subseqüentes gerarão menos tráfego, havendo um menor custo da largura de banda.
Métodos de Comunicação com Servidor Web
Um navegador web só conhece duas maneiras de enviar dados para um servidor: através de hiperlinks e formulários
HTML, métodos chamados de GET e POST, respectivamente. Como já estudamos no documento anterior, podemos
acionar funções JavaScript também através de hiperlinks e formulários. Realizando requisições assíncronas a um
servidor web, não será mais necessário aguardar ao clicar em um hiperlink ou submeter um formulário, de forma
que a página web atual do usuário receba apenas alguns dados que serão atualizados dinamicamente em sua página
atual. Uma aplicação Ajax, portanto, é um código JavaScript que se comunica com o servidor enquanto o usuário
continua trabalhando, evitando o clássico modelo “clica e espera” do usuário.
Compatibilidade entre Navegadores Web
Aplicações Ajax contém código JavaScript complexos que são executados no lado cliente, aumentando bastante a
possibilidade de erros e falta de compatibilidade entre os diversos navegadores. Toda aplicação Ajax deve estar
preparada para fazer verificações de compatibilidade entre navegadores. O objeto utilizado para realizar requisições
assíncronas é o XMLHttpRequest. O exemplo seguinte permite verificar, através da linguagem JavaScript, se o
navegador do cliente está preparado para a executar aplicações Ajax. O código seguinte está escrito em JavaScript.
Retornar apenas as informações relevantes à aplicação no momento é a
principal característica de uma aplicação Ajax.
