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?

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");
  }
});

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.


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


Ü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);
  }
});

15
$.post('someUri', { }, 
  function(data){ doSomeStuff })
 .fail(function(error) { alert(error.responseJSON) });

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.');
  }
});

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'] );
})

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 );
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.