O objeto XMLHttpRequest é usado para trocar dados com o servidor.
Para enviar uma solicitação ao servidor, usamos os métodos open() e send() do objeto XMLHttpRequest:
xmlhttp.open("GET","ajax_info.txt",true);xmlhttp.send();
método | descrever |
---|---|
open( método , url , assíncrono ) | Especifica o tipo de solicitação, a URL e se a solicitação deve ser tratada de forma assíncrona. método : tipo de solicitação GET ou POST; url : A localização do arquivo no servidor assíncrono : verdadeiro (assíncrono) ou falso (síncrono) |
enviar( string ) | Envie a solicitação ao servidor. string : usado apenas para solicitações POST |
GET é mais simples e rápido que POST e funciona na maioria das situações.
No entanto, use solicitações POST nas seguintes situações:
Não é possível usar arquivos em cache (atualizando arquivos ou bancos de dados no servidor)
Envie grandes quantidades de dados para o servidor (o POST não tem limite de tamanho de dados)
POST é mais estável e confiável que GET ao enviar entradas do usuário contendo caracteres desconhecidos
Uma simples solicitação GET:
No exemplo acima, você pode estar obtendo resultados em cache.
Para evitar isso, adicione um ID exclusivo ao URL:
Se desejar enviar informações pelo método GET, adicione as informações à URL:
Uma simples solicitação POST:
Se você precisar POST dados como um formulário HTML, use setRequestHeader() para adicionar cabeçalhos HTTP. Em seguida, especifique os dados que deseja enviar no método send():
método | descrever |
---|---|
setRequestHeader( cabeçalho,valor ) | Adicione cabeçalhos HTTP à solicitação. header : especifica o nome do cabeçalho valor : especifica o valor do cabeçalho |
O parâmetro url do método open() é o endereço do arquivo no servidor:
xmlhttp.open("GET","ajax_test.html",true);
O arquivo pode ser qualquer tipo de arquivo, como .txt e .xml, ou um arquivo de script de servidor, como .asp e .php (que pode executar tarefas no servidor antes de enviar a resposta de volta).
AJAX refere-se a JavaScript e XML assíncronos.
Se o objeto XMLHttpRequest for usado para AJAX, o parâmetro async de seu método open() deve ser definido como true:
xmlhttp.open("GET","ajax_test.html",true);
Para desenvolvedores web, o envio de solicitações assíncronas é uma grande melhoria. Muitas tarefas executadas no servidor consomem bastante tempo. Antes do AJAX, isso poderia fazer com que o aplicativo travasse ou parasse.
Com AJAX, JavaScript não precisa esperar por uma resposta do servidor, mas sim:
Execute outros scripts enquanto aguarda a resposta do servidor
Processe a resposta quando estiver pronta
Ao usar async=true, especifique uma função a ser executada em resposta ao estado pronto no evento onreadystatechange:
Você aprenderá mais sobre onreadystatechange em um capítulo posterior.
Se você quiser usar async=false, altere o terceiro parâmetro no método open() para false:
xmlhttp.open("GET","test1.txt",falso);
Não recomendamos usar async=false, mas para algumas solicitações pequenas é possível.
Lembre-se, o JavaScript espera até que a resposta do servidor esteja pronta antes de continuar. Se o servidor estiver ocupado ou lento, o aplicativo trava ou para.
Nota: Ao usar async=false, não escreva a função onreadystatechange - apenas coloque o código após a instrução send():