Requisições síncronas e assíncronas

No ambiente cliente-servidor, nossas aplicações trabalham através de requisições e respostas, onde o cliente (Ex: Navegador) envia uma requisição e o servidor, local onde está nossa aplicação, retorna uma resposta, nesse processo existem diversas etapas, mas o objetivo deste artigo não é abordar cada estado de uma requisição, nesse momento vamos entender como funciona uma requisição utilizando comunicação síncrona e assíncrona.

Tipos de requisição

Síncrona

Quando uma requisição é enviada, o processo remetente é bloqueado até que ocorra uma resposta, ou seja, não é possível enviar novas requisições até que nossa requisição atual seja finalizada, existe sincronismo entre as requisições.

Assíncrona

Em uma requisição assíncrona, não existe sincronismo entre as requisições, sendo assim, podemos enviar diversas requisições em paralelo, onde cada resposta retorna quando estiver pronta.

Requisição Síncrona e Assíncrona
Requisição Síncrona e Assíncrona

Requisição vs Pizza

Agora que conhecemos os tipos de requisição, vamos fazer uma analogia com um caso do nosso cotidiano, comprar pizza. Quando queremos comprar pizza, temos basicamente duas opções, ir comprar em alguma pizzaria ou pedir pelo telefone, essas situações são equivalentes aos tipos de requisição, pois pedimos pizza pelo telefone por comodidade, não queremos sair de casa para comprar, apenas fazemos uma solicitação, continuamos nossas tarefas e recebemos uma resposta quando essa estiver pronta, nossa pizza neste caso, esse fluxo de comodidade representa uma requisição assíncrona, enviamos uma requisição em paralelo e aguardamos sua resposta a qualquer momento, sem sincronismo, já no caso de ir comprar uma pizza, realizamos uma sincronia, compramos nossa pizza, voltamos para casa, para depois continuar com nossas tarefas.

Comprar Pizza
Comprar Pizza

AJAX síncrono e assíncrono com jQuery

Muita gente acredita que AJAX se resume em requisições assíncronas, mas isso é um engano, também é possível realizar requisições síncronas, como estudamos anteriormente, nas requisições síncronas, só prosseguimos com nossas tarefas após obter nossa resposta.

Por padrão o jQuery utiliza requisições assíncronas para trabalhar com AJAX, mas caso seja necessário trabalhar com AJAX através de requisições síncronas, precisamos trabalhar com o método jQuery.ajax() configurando sua propriedade async como false.

Requisição síncrona

$.ajax({
    url: 'script.php',
    async: false
}).done(function(data) {
    alert(data);
});

Requisição assíncrona

$.ajax({
    url: 'script.php',
    async: true
}).done(function(data) {
    alert(data);
});

Arquivo script.php

<?php
// 5 seconds
sleep(5);

// Response
echo "Hello";
?>
No caso da requisição síncrona o navegador fica bloqueado enquanto aguarda o retorno da requisição, afinal estamos indo comprar nossa pizza, faça seu teste.

Referência(s)

http://pt.wikipedia.org/wiki/Hypertext_Transfer_Protocol

http://pt.wikipedia.org/wiki/Comunica%C3%A7%C3%A3o_s%C3%ADncrona

http://api.jquery.com/jQuery.ajax/

  • Iago Effting

    06/02/2013 às 15:30

    Muito bem dito Diogo, como sabemos todos necessitam de velocidade para se sentir mais a vontade com as aplicações; ter que esperar uma ação ser realizada para fazer outra se torna errado, dando a impressão de um sistema lento. Agora, se utilizarmos as requisições assíncronas, o usuário poderá fazer uma ação enquanto uma outra é executada em plano de fundo (caso uma não interfira na outra), fazendo com que ele possa fazer diversas ações sem ter que esperar que as requisições anteriores terminem.

  • Dorian Sampaio

    04/12/2013 às 18:34

    Muito simples e explicativo :) Show de bola !

  • Rafael

    23/12/2013 às 19:00

    Muito bem explicao!! Otimo artigo!

  • Rodrigo Dill

    04/06/2014 às 11:46

    Excelente explicação.
    Obrigado!

  • Ernani

    09/09/2014 às 12:35

    Diogo,
    estou consumindo um serviço e preciso rastrear o programa no servidor.
    Quando faço echo “mensagem”, não consigo ver a saída. onde vejo isso?

  • Diogo Matheus

    09/09/2014 às 21:43

    Iago,

    Com certeza, mas visando o funcionamento e usabilidade do sistema o ideal é que primeiro seja feito de modo síncrono, selecionando recursos certos para otimizar e possibilitar esse tipo de conceito.

  • Diogo Matheus

    09/09/2014 às 21:44

    Ernani,

    Isso depende de como está sendo executado seu script e o que ocorre após sua execução, já pensou em uma tabela de log ou arquivo físico diário para controlar os acessos?

  • Claudio Balbin

    09/05/2016 às 08:58

    Excelente explicação! Obrigado!

  • Lucas de Oliveira Gonçalves

    11/11/2016 às 03:38

    Belo post. Obrigado!

  • Ruan Alves

    27/11/2016 às 19:03

    Belo post. Obrigado!

  • Rodrigo

    21/02/2017 às 16:58

    Amigo você sabe me dizer se no PHP por exemplo tem 10 usuários utilizando o mesmo arquivo, ele processa 1 por vez ou todos simultaneamente podendo causar duplicidade no banco de dados mysql em uma inserção?

  • Cristiano

    06/04/2017 às 17:41

    Orra! Ótima explicação, bem didatico, agora sim entendi esse treco. Com requisição sincrona, não preciso mais utilizar o timeout como gambi para aguardar o ajax retornar o resultado para chamar uma modal, basta usar async:false.

  • Jackson Smith

    20/06/2017 às 13:27

    HAHAHAHA.

    Curti o exemplo da pizza e o texto parabéns.

  • Luciana

    19/09/2017 às 08:08

    Bem explicado, vlw!

  • Manuel Peradeles

    14/08/2018 às 15:50

    Show!!!! Simples e eficiente.

  • Dowglas Maia

    20/02/2019 às 10:50

    Show de bola, eu não entendia bem como funcionava essas requisições!

  • Fabio Luis Rodrigues

    03/04/2019 às 17:10

    E quando você usa a opção async=true e mesmo assim o browser trava?

Deixe uma resposta

O seu endereço de e-mail não será publicado.. Campos obrigatórios são marcados com *