Ajax (Asynchronous Javascript And Xml)

Ajax (Asynchronous Javascript And Xml)

• 1.
  AJAX (Asynchronous JavascriptAnd XML) Seminário de Sistemas Distribuidos
• 2.
  O que éAJAX? É uma técnica de desenvolvimento client-side que permite recuperar dados do servidor de maneira assincrona, sem interferir na página que faz a requisição. 
• 3.
  O que AJAXtem há ver com Sistemas Distribuídos? Usando o conceito de AJAX, nós podemos disparar requisições em background enquanto o site continua responsivo, não prejudicando o fluxo do site
• 4.
  Vantagens da utilizaçãode AJAX Aplicações mais "dinâmicas" Possibilidade de processar várias requisições ao mesmo tempo Velocidade de processamento (Não é necessário enviar todos os headers para a requisição 
• 5.
  Principais usos doAJAX Iteração com APIs (Twitter, Facebook, Picasa, Flickr) Submissão de formulários Aplicações Ricas (Gmail, iGoogle, Google Reader)
• 6.
  Restrições Existem algumasrestrições para o uso de AJAX, apesar de todos os browsers modernos permitirem o uso de requisições assincronas, os mais antigos (bem antigos) não tem suporte (campanha "Morra IE6 e toda sua corja"), assim como alguns browsers mobile (Opera mini, Nokia Browser)
• 7.
  Como fazer umarequisição assincrona function carrega(url){          //Exibe o texto carregando no div conteúdo          var conteudo=document.getElementById(&quot;conteudo&quot;)          conteudo.innerHTML='<div class=&quot;carregando&quot;>carregando...</div>'          //Abre a url          xmlhttp.open(&quot;GET&quot;, url,true);          //Executada quando o navegador obtiver o código          xmlhttp.onreadystatechange=function() {                 if (xmlhttp.readyState==4){                     //Lê o texto                     var texto=xmlhttp.responseText                      //Desfaz o urlencode                      texto=texto.replace(/\+/g,&quot; &quot;)                      texto=unescape(texto)                      //Exibe o texto no div conteúdo                      var conteudo=document.getElementById(&quot;conteudo&quot;)                      conteudo.innerHTML=texto                  }          }          xmlhttp.send(null)      }
• 8.
  Bibliotecas para facilitaro uso de AJAX jQuery (http://www.jquery.com) Prototype (http://www.prototypejs.org/) Mootools (http://mootools.net/) Dojo (http://www.dojotoolkit.org/) Várias outras que não vou citar (google it)
• 9.
  Exemplo de AJAXusando jQuery //requisitando uma URL e enviando dados via GET $.get(      &quot;teste.php&quot;,       {nome: &quot;Henrique&quot;, sobrenome: &quot;Boaventura} );      //requisitando uma URL e enviando dados via POST $.post(      &quot;teste.php&quot;,       {nome: &quot;Henrique&quot;, sobrenome: &quot;Boaventura} );      //requisitando uma URL sem enviar nada e colocando o conteúdo dentro de um elemento      $('#resultado').load('teste.php');
• 10.
  AJAX vs. HTML5Com o HTML5 surgiu uma nova maneira que fazer requisições assincronas, muito mais transparente e a prova de falhas. Os WebSockets fazem basicamente a mesma coisa que o AJAX, mas mantém uma conexão constante com o servidor, sem a necessidade de inúmeras requisições. Apenas um keepAlive é enviado para dizer... estou vivo.