Função de erro jQuery ajax

130

Eu tenho uma chamada ajax passando dados para uma página que retorna um valor.

Eu recuperei a chamada bem-sucedida da página, mas a codifiquei para gerar um erro no asp. Como recupero esse erro do jquery?

Por exemplo:

cache: false,
url: "addInterview_Code.asp",
type: "POST",
datatype: "text",
data: strData,
success: function (html) {
    alert('successful : ' + html);
    $("#result").html("Successful");
},
error: function (error) {
    **alert('error; ' + eval(error));**
}

É o bit de erro que eu não entendo. Na função, qual parâmetro eu preciso colocar, para que eu possa usar a mensagem de erro que eu levantei no servidor.

Darryl Wilson
fonte
Há um erro de digitação lá: é dataTypenão datatype.
Alejandro Nava
Além disso, o jQuery diz que você não pode usar tanto o sucesso quanto o erro , como fez.
Alejandro Nava
7
@ alej27: o texto é meio estranho, mas não diz que você não pode usar os dois, diz que uma solicitação não chamará sucesso e erro (porque eles são mutuamente exclusivos).
Marty Vance
Tenha cuidado com as respostas aqui No jQuery 3.0, os itens obsoletos observados .errore .successse tornam mais importantes à medida que foram removidos.
Mark Schultheiss

Respostas:

221

Os parâmetros necessários em uma errorfunção Ajax são jqXHR, exceptione você pode usá-lo como abaixo:

$.ajax({
    url: 'some_unknown_page.html',
    success: function (response) {
        $('#post').html(response.responseText);
    },
    error: function (jqXHR, exception) {
        var msg = '';
        if (jqXHR.status === 0) {
            msg = 'Not connect.\n Verify Network.';
        } else if (jqXHR.status == 404) {
            msg = 'Requested page not found. [404]';
        } else if (jqXHR.status == 500) {
            msg = 'Internal Server Error [500].';
        } else if (exception === 'parsererror') {
            msg = 'Requested JSON parse failed.';
        } else if (exception === 'timeout') {
            msg = 'Time out error.';
        } else if (exception === 'abort') {
            msg = 'Ajax request aborted.';
        } else {
            msg = 'Uncaught Error.\n' + jqXHR.responseText;
        }
        $('#post').html(msg);
    },
});

DEMO FIDDLE


Parâmetros

jqXHR:

Na verdade, é um objeto de erro que se parece com isso

Objeto jqXHR de erro do Ajax

Você também pode ver isso no seu próprio console do navegador, usando console.loga errorfunção como:

error: function (jqXHR, exception) {
    console.log(jqXHR);
    // Your error handling logic here..
}

Estamos usando a statuspropriedade desse objeto para obter o código de erro, como se obtivermos status = 404, isso significa que a página solicitada não pôde ser encontrada. Não existe. Com base nesse código de status, podemos redirecionar os usuários para a página de login ou o que nossa lógica de negócios exigir.

exceção:

Esta é uma variável de sequência que mostra o tipo de exceção. Portanto, se estivermos recebendo um erro 404, o exceptiontexto seria simplesmente 'erro'. Da mesma forma, podemos obter 'timeout', 'abort' como outros textos de exceção.


Deprecation Aviso: A jqXHR.success(), jqXHR.error(), e jqXHR.complete()chamadas de retorno são obsoleto a partir do jQuery 1.8. Para preparar o código para a sua eventual remoção, use jqXHR.done(), jqXHR.fail()e jqXHR.always()em vez disso.

Portanto, caso você esteja usando o jQuery 1.8 ou superior , precisaremos atualizar a lógica da função de sucesso e erro, como:

// Assign handlers immediately after making the request,
// and remember the jqXHR object for this request
var jqxhr = $.ajax("some_unknown_page.html")
    .done(function (response) {
        // success logic here
        $('#post').html(response.responseText);
    })
    .fail(function (jqXHR, exception) {
        // Our error logic here
        var msg = '';
        if (jqXHR.status === 0) {
            msg = 'Not connect.\n Verify Network.';
        } else if (jqXHR.status == 404) {
            msg = 'Requested page not found. [404]';
        } else if (jqXHR.status == 500) {
            msg = 'Internal Server Error [500].';
        } else if (exception === 'parsererror') {
            msg = 'Requested JSON parse failed.';
        } else if (exception === 'timeout') {
            msg = 'Time out error.';
        } else if (exception === 'abort') {
            msg = 'Ajax request aborted.';
        } else {
            msg = 'Uncaught Error.\n' + jqXHR.responseText;
        }
        $('#post').html(msg);
    })
    .always(function () {
        alert("complete");
    });

Espero que ajude!

palaşн
fonte
6
Curiosamente, não é recomendado usar ajaxSetup. Veja api.jquery.com/jquery.ajaxsetup
SleepyBoBos
1
@ palaѕн Eu acho que você interpretou mal o aviso de depreciação. Se você perceber, o aviso de descontinuação está falando de descontinuação dos métodos do jqXHR, mas o uso de êxito, erro e conclusão no exemplo acima é feito dentro de um objeto para o método $ .ajax. Isso não foi preterido e você não precisa mudar seu código. No entanto, se preferir encadear os métodos, você poderá usar esse estilo. Quando eu li "deprecação ...", isso me excitou (sem motivo). :-)
bchr02 14/10
A partir do jQuery 3.0, os obsoletos foram anotados .errore .successse tornaram mais importantes à medida que foram removidos
Mark Schultheiss
99

Tente o seguinte:

error: function(jqXHR, textStatus, errorThrown) {
  console.log(textStatus, errorThrown);
}

Se você deseja informar seu front-end sobre um erro de validação, tente retornar o json:

dataType: 'json',
success: function(data, textStatus, jqXHR) {
   console.log(data.error);
}

Seu script asp deve retornar:

{"error": true}
czerasz
fonte
1
Para que servem textSttaus e errorThrown? Pode me explicar
Annapurna
4

Aqui está como você extrai o erro asp.

              cache: false,
              url: "addInterview_Code.asp",
              type: "POST",
              datatype: "text",
              data: strData,
              success: function (html) {
                  alert('successful : ' + html);
                  $("#result").html("Successful");
              },
              error: function (jqXHR, textStatus, errorThrown) {
                  if (jqXHR.status == 500) {
                      alert('Internal error: ' + jqXHR.responseText);
                  } else {
                      alert('Unexpected error.');
                  }
              }
Rich C
fonte
2
error(jqXHR, textStatus, errorThrown)

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

Praveen Prasad
fonte
9
Forneça explicações, não apenas um pedaço de código e um link do docs.
Greg Dubicki
12
Obrigado por quase nada.
precisa saber é
por exemplo, você poderia ter dito "OP está usando um erro de função (erro), mas jquery está chamando um erro de função (jqXHR, textStatus, errorThrown). Observe os 2 parâmetros ausentes no snippet do OP".
increddibelly
2
          cache: false,
          url: "addInterview_Code.asp",
          type: "POST",
          datatype: "text",
          data: strData,
          success: function (html) {
              alert('successful : ' + html);
              $("#result").html("Successful");
          },
          error: function(data, errorThrown)
          {
              alert('request failed :'+errorThrown);
          }
sT0n3
fonte
2

você está usando uma função

error(error) 

mas o jquery está realmente procurando uma função com três parâmetros:

error(jqXHR, textStatus, errorThrown)

você precisará adicionar mais dois parâmetros.

TAMBÉM: dê uma olhada em todos os comentários acima que mencionam 'obsoleto' :)

$.ajax("www.stackoverflow.com/api/whatever", {
    dataType:"JSON"
    data: { id=1, name='example' }
}).succes(function (result) {
    // use result
}).error(function (jqXHR, textStatus, errorThrown) {
    // handle error
});
increddibelly
fonte
4
você precisará adicionar mais dois parâmetros - isso é tão errado.
Desenvolvedor
1
Hmm. se é tudo o que você tem a dizer - talvez não diga nada? ou, você PODE explicar sua declaração e realmente ajudar. Sua escolha.
increddibelly
1
Em JavaScript, diga que você tem um método - function myMethod (err) { alert(err); }e depois chame-o como myMethod ("something is wrong", 500, some_object)- Isso funcionará sem nenhum problema. Conforme sua declaração, isso só funcionaria se a assinatura do método fosse function myMethod (err, status, some_object). Esqueça o exemplo acima, a assinatura do successevento que você tem na resposta é realmente .success(data, status, xhr), mas se você só precisa do resultado, geralmente o vinculamos como .success (data)e ambos funcionam.
Desenvolvedor
E que valor agregado você trouxe adicionando esta resposta? Na IMO, não há nenhuma informação na sua resposta que esteja faltando nas respostas anteriores. A única coisa que você fez foi colocar essa questão na pilha novamente.
Desenvolvedor
0

Em jquery.com:

The jqXHR.success(), jqXHR.error(), and jqXHR.complete()
callback methods introduced injQuery 1.5 are deprecated
as of jQuery 1.8. To prepare your code for their eventual 
removal, use jqXHR.done(), jqXHR.fail(), and jqXHR.always() instead.

Se você deseja manipuladores globais, pode usar:

.ajaxStart(), .ajaxStop(),
.ajaxComplete(), .ajaxError(),
.ajaxSuccess(), .ajaxSend()
John Kloian
fonte