14

Tenho uma operação que preciso realizar de forma síncrona, mas parte das informações das quais preciso somente podem ser obtidas via Ajax.

Tentei tornar tudo síncrono com uma espera pelo retorno do Ajax. O problema é que enquanto qualquer função estiver executando, os eventos do Ajax que tratam do retorno com sucesso não são executados.

Isso é um exemplo do que estou a fazer:

function foo () {
    var a = false;
    $.ajax({
        url: "foo" // substitua por qualquer URL real
    }).done(function () {
        a = true;
    });

    while(!a) { } // Isto é apenas para se ter uma espera.
    alert(a); // Isso nunca vai executar
}
foo();

E isso tem me gerado uma race condition: a função associada ao evento done não executará enquanto o while estiver a iterar, e o while jamais terminará enquanto o evento done não for executado.

Existe alguma forma de se atingir meu objetivo?

8
  • Depende um pouco do que você quer fazer, mas pode sempre chamar uma função defenida fora do .done() passando a resposta do ajax como parâmetro. Pode juntar mais código para percebermos melhor o seu problema?
    – Sergio
    Commented 18/02/2014 às 20:04
  • já tentou levantar uma exceção se não houver resposta do servidor? dentro do while você testa se o tempo de espera for maior 5 * 60 * 1000 (5 minutos) caso verdadeiro então dispara uma exceção avisando que não houve resposta do servidor...
    – Filipe
    Commented 18/02/2014 às 20:06
  • @Sergio o problema é simples... Apenas esperar, dentro de uma função síncrona, pelo retorno de uma chamada assíncrona. Quero forçar uma operação a ser síncrona. Coloquei um pouco mais de código apenas para ilustrar melhor. Commented 18/02/2014 às 20:06
  • 1
    @Renan juntei um jsFiddle ao meu comentário em cima. Opção é usar async: false como o bfavaretto sugeriu, tendo conta dos avisos e problemas que isso pode trazer.
    – Sergio
    Commented 18/02/2014 às 20:08
  • @Renan O que te impede de chamar a uma função com o comportamento desejado dentro do done?
    – Filipe
    Commented 18/02/2014 às 20:12

3 Respostas 3

16

Sim, mas em primeiro lugar preciso deixar claro que usar ajax de forma síncrona é altamente contra-indicado. A interface de usuário ficará congelada até o retorno do ajax.

O código para isso em jQuery é:

var a;
$.ajax({
    url: "foo", // substitua por qualquer URL real
    async: false
}).done(function () {
    a = true;
});
console.log(a);

O while não funciona pois ele está bloqueando a única thread usada em JS. Enquanto o código não sai do while, o event loop não avança, e os eventos assíncronos (o done/complete do ajax incluso) não são nunca processados. E assim o valor de a nunca muda, e o while nunca termina, é um loop infinito.

5
  • Agora me sinto mal por não ter lido o manual... async: false foi o pulo do gato mesmo. Commented 18/02/2014 às 20:10
  • 3
    Mas não custa insistir, @Renan: se você puder alterar o código para trabalhar de maneira assíncrona, faça isso.
    – bfavaretto
    Commented 18/02/2014 às 20:13
  • 1
    Pode ter certeza de que farei :) Encontrei formas melhores de se resolver o meu problema aqui, mas ainda assim é interessante conhecer a opção síncrona pra chamada do método ajax do jQuery. Commented 18/02/2014 às 20:19
  • E eu como um bom noob fiz uma gambiarra imensa no meu projeto para executar o resto de uma função só depois que o ajax retornasse algo. Bendito StackOverflow.
    – Joao Paulo
    Commented 18/02/2014 às 21:33
  • @JoaoPaulo Provavelmente você fez a coisa certa, ajax é feito para ser usado de maneira assíncrona.
    – bfavaretto
    Commented 18/02/2014 às 23:15
3

Já tentou utilizar callbacks?

function foo (callback) {
  $.ajax({
      url: "/minha_api",
      myCallback: callback,
      success: function(){
        this.myCallback(true);
      }          
  });     
}

foo(function(a){
   alert(a);
});
2

No ultimo caso, quando nada estiver funcionando:

function foo () {
    var a = false;
    $.ajax({
        url: "foo" // substitua por qualquer URL real
    }).done(function () {
        a = true;
    });

    setInterval(function () {
        if (a) {
            alert(a); // Isso pode acontecer
        }
    }, 100);
}

foo();
1

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .