O Ajax está bem classificado nos principais motivos para usar jQuery. O jQuery não apenas corrige os problemas entre navegadores, mas torna a sintaxe muito fácil de usar e entender.
Neste vídeo, tentamos explicar o que é Ajax. Observamos um elemento de formulário que, quando enviado, faz uma solicitação GET ou POST (conforme determinado pelo atributo method) para a URL que você especifica (conforme determinado pelo atributo action). Isso é apenas HTML, nenhum código de back-end ou JavaScript acontecendo ali. Mas esse envio fará com que a página mude, literalmente recarregando no novo URL, como clicar em um link.
O Ajax nos permite fazer essa solicitação GET ou POST em segundo plano, sem recarregar a página. Em sua essência, esse é o ponto principal do Ajax. E é muito poderoso. É em grande parte responsável por por que os sites modernos funcionam e são transmitidos da maneira que funcionam.
Ajax costumava "representar" JavaScript assíncrono e XML, mas isso é amplamente ignorado atualmente porque não significa muito. Daí também a descapitalização. Você também pode às vezes ver “XHR” que é a abreviação de XMLHttpRequest, que é a tecnologia de núcleo nativa do Ajax.
A diferença entre GET e POST é essencialmente: GET é para obter informações e não deve ser responsável por alterar dados e POST é especificamente para alterar dados. Sinta-se à vontade para ler mais sobre isso neste tópico do StackOverflow.
Fazer uma solicitação GET no jQuery é incrivelmente fácil:
$.get( "URL", function(data) ( // do something with data )); ));O URL é de onde você espera obter os dados. O segundo parâmetro é a função de retorno de chamada executada quando a solicitação Ajax foi bem-sucedida. O parâmetro mais importante ali é o primeiro, data, que contém as informações obtidas na solicitação.
As solicitações Ajax podem falhar às vezes. Um motivo para essa falha pode ser o próprio navegador e suas políticas de segurança. Construídas nos próprios navegadores, existem regras sobre onde o conteúdo pode ser solicitado. As solicitações sempre podem ser feitas para o mesmo domínio de onde vem a solicitação. Mas se houver um domínio diferente envolvido, esse domínio diferente precisará permitir isso especificamente.
Você pode ler tudo sobre isso em enable-cors.org. CORS significa “Compartilhamento de recursos entre origens”. Vemos um exemplo em que CORS não está habilitado e a solicitação Ajax falha. Uma maneira padrão e fácil de corrigir isso, supondo que o servidor seja o Apache, é definir um cabeçalho que permita especificamente o CORS por meio do arquivo .htaccess:
Header set Access-Control-Allow-Origin "*"No vídeo, apenas movemos a solicitação Ajax para CodePen, que lida bem com Ajax por padrão.
Queijo fácil:
Veja a Pen fBInl de Chris Coyier (@chriscoyier) no CodePen