Wie kann ich einen Ajax-Abfragefehler abfangen?

209

Ich möchte den Fehler abfangen und die entsprechende Meldung anzeigen, wenn die Ajax-Anforderung fehlschlägt.

Mein Code sieht wie folgt aus, aber ich konnte die fehlgeschlagene Ajax-Anforderung nicht abfangen.

function getAjaxData(id)
{
     $.post("status.ajax.php", {deviceId : id}, function(data){

        var tab1;

        if (data.length>0) {
            tab1 = data;
        }
        else {
            tab1 = "Error in Ajax";
        }

        return tab1;
    });
}

Ich habe herausgefunden, dass "Fehler in Ajax" niemals ausgeführt wird, wenn die Ajax-Anforderung fehlgeschlagen ist.

Wie gehe ich mit dem Ajax-Fehler um und zeige die entsprechende Meldung an, wenn dies fehlschlägt?

TTCG
quelle

Antworten:

304

Seit jQuery 1.5 können Sie den Mechanismus für verzögerte Objekte verwenden:

$.post('some.php', {name: 'John'})
    .done(function(msg){  })
    .fail(function(xhr, status, error) {
        // error handling
    });

Ein anderer Weg ist .ajax:

$.ajax({
  type: "POST",
  url: "some.php",
  data: "name=John&location=Boston",
  success: function(msg){
        alert( "Data Saved: " + msg );
  },
  error: function(XMLHttpRequest, textStatus, errorThrown) {
     alert("some error");
  }
});
wählen
quelle
14
@Yuck $ .post kann einen Fehlerrückruf mit zurückgestellten Objekten akzeptieren. Schauen Sie sich meine Antwort unten als Beispiel an.
Michael Venable
2
Außerdem kann ich die $.ajaxLesbarkeit verbessern, indem ich einen Hash für Sie verwende data. Zum Beispiel:{ name : 'John', location: 'Boston' }
Briangonzalez
3
Die oben genannten Rückrufe für Erfolg und Fehler sind ab jQuery 1.8 veraltet. Api.jquery.com/jQuery.post
Baldy
@ MichaelVeneble Ich denke, Sie können verwenden$.post().error()
Clintgh
288

jQuery 1.5 fügte zurückgestellte Objekte hinzu, die dies gut handhaben. Rufen $.postSie einfach an und fügen Sie nach dem Anruf alle gewünschten Handler hinzu. Mit zurückgestellten Objekten können Sie sogar mehrere Erfolgs- und Fehlerbehandlungsroutinen anhängen.

Beispiel:

$.post('status.ajax.php', {deviceId: id})
    .done( function(msg) { ... } )
    .fail( function(xhr, textStatus, errorThrown) {
        alert(xhr.responseText);
    });

Vor jQuery 1.8 wurde die Funktion doneaufgerufen successund failaufgerufen error.

Michael Venable
quelle
3
+1 Sehr schön, aber immer noch nicht verrückt nach der Syntax. Hoffentlich wird es in einer zukünftigen Version vereinheitlicht.
Yuck
25
Dies sollte die akzeptierte Antwort sein. Die aktuell akzeptierte Antwort lautet "Verwenden Sie eine andere Methode". Diese Antwort lautet: "So funktioniert Ihre Methode". Letzteres wird normalerweise bei SO bevorzugt. Eigentlich sollte dies in der $ .post Dokumentation enthalten sein !!!
Mark E. Haase
2
api.jquery.com/deferred.fail , api.jquery.com/deferred.done für die Dokumentation
Deleplace
Übrigens gibt es auch responseJSONEigenschaft, die auch im Falle eines Ajax-Typs sehr praktisch ist json.
ivkremer
91
$.ajax({
  type: 'POST',
  url: 'status.ajax.php',
  data: {
     deviceId: id
  },
  success: function(data){
     // your code from above
  },
  error: function(xhr, textStatus, error){
      console.log(xhr.statusText);
      console.log(textStatus);
      console.log(error);
  }
});
jAndy
quelle
15
$.post('someUri', { }, 
  function(data){ doSomeStuff })
 .fail(function(error) { alert(error.responseJSON) });
Marknery
quelle
5
Ein bisschen mehr Erklärung hier hinzuzufügen würde zukünftigen Lesern helfen.
Eric Brown
13

Eine einfache Möglichkeit besteht darin, ajaxError zu implementieren :

Immer wenn eine Ajax-Anforderung mit einem Fehler abgeschlossen wird, löst jQuery das Ereignis ajaxError aus. Alle Handler, die mit der Methode .ajaxError () registriert wurden, werden zu diesem Zeitpunkt ausgeführt.

Beispielsweise:

$('.log').ajaxError(function() {
  $(this).text('Triggered ajaxError handler.');
});

Ich würde empfehlen, die ajaxError- Dokumentation zu lesen . Es kann mehr als den oben gezeigten einfachen Anwendungsfall - hauptsächlich akzeptiert sein Rückruf eine Reihe von Parametern:

$('.log').ajaxError(function(e, xhr, settings, exception) {
  if (settings.url == 'ajax/missing.html') {
    $(this).text('Triggered ajaxError handler.');
  }
});
karim79
quelle
1
+1 - Ich würde hinzufügen, dass dieser Handler mehrere Argumente erhält, so dass Sie den tatsächlichen Fehler, den Antwortcode, die URL usw. anzeigen können.
Nick Craver
Beachten Sie, dass ab jQuery 1.8 die Methode .ajaxError () nur an das Dokument angehängt werden sollte.
Nanki
0

Sie müssen den responseText protokollieren:

$.ajax({
    type: 'POST',
    url: 'status.ajax.php',
    data: {
    deviceId: id
  }
})
.done(
 function (data) {
  //your code
 }
)
.fail(function (data) {
      console.log( "Ajax failed: " + data['responseText'] );
})
Manolo
quelle
0

Sie hängen den .onerror-Handler an das Ajax-Objekt an. Warum bestehen die Leute darauf, JQuery für Antworten zu veröffentlichen, wenn Vanila plattformübergreifend arbeitet?

Quickie-Beispiel:

ajax = new XMLHttpRequest();
ajax.open( "POST", "/url/to/handler.php", true );
ajax.onerror = function(){
    alert("Oops! Something went wrong...");
}
ajax.send(someWebFormToken );
Mark Giblin
quelle