Ajax-Anforderung gibt 200 OK zurück, aber ein Fehlerereignis wird anstelle des Erfolgs ausgelöst

805

Ich habe eine Ajax-Anfrage auf meiner Website implementiert und rufe den Endpunkt von einer Webseite aus auf. Es wird immer 200 OK zurückgegeben , aber jQuery führt das Fehlerereignis aus.
Ich habe viele Dinge ausprobiert, aber ich konnte das Problem nicht herausfinden. Ich füge meinen Code unten hinzu:

jQuery-Code

var row = "1";
var json = "{'TwitterId':'" + row + "'}";
$.ajax({
    type: 'POST',
    url: 'Jqueryoperation.aspx?Operation=DeleteRow',
    contentType: 'application/json; charset=utf-8',
    data: json,
    dataType: 'json',
    cache: false,
    success: AjaxSucceeded,
    error: AjaxFailed
});
function AjaxSucceeded(result) {
    alert("hello");
    alert(result.d);
}
function AjaxFailed(result) {
    alert("hello1");
    alert(result.status + ' ' + result.statusText);
}

C # -Code für JqueryOpeartion.aspx

protected void Page_Load(object sender, EventArgs e) {
    test();
}
private void test() {
    Response.Write("<script language='javascript'>alert('Record Deleted');</script>");
}

Ich brauche die ("Record deleted")Zeichenfolge nach erfolgreichem Löschen. Ich kann den Inhalt löschen, erhalte diese Meldung jedoch nicht. Ist das richtig oder mache ich etwas falsch? Was ist der richtige Weg, um dieses Problem zu lösen?

Pankaj Mishra
quelle
2
Können Sie die Ausgabe von JqueryOperation.aspx über einen JSON-Validator
ausführen und prüfen,
1
Wie jsonlint.com . Sie müssen auch die von Ihnen gesendeten Parameter überprüfen. Derzeit haben Sie keinen Parameternamen festgelegt. Wenn der Parameter ist TwitterId, müssen Sie ein Objekt übergeben data, nicht eine Zeichenfolge : data: {TwitterId: row}.
Felix Kling
6
Gibt die Seite Jqueryoperation.aspx (gültiges) JSON zurück?
Salman A
1
Wahrscheinlich löst Ihr serverseitiger Code eine Ausnahme aus. Was wird in Ihrem catch-Block als Antwort zurückgegeben?
Raghav
3
@Raghav, wenn der Server eine Ausnahme auslöste, die die Anfrage verarbeitete, dann wäre der HTTP-Rückkehrcode 500.
StuperUser

Antworten:

1118

jQuery.ajaxversucht, den Antworttext abhängig vom angegebenen dataTypeParameter oder dem Content-Typevom Server gesendeten Header zu konvertieren . Wenn die Konvertierung fehlschlägt (z. B. wenn JSON / XML ungültig ist), wird der Fehlerrückruf ausgelöst.


Ihr AJAX-Code enthält:

dataType: "json"

In diesem Fall jQuery:

Wertet die Antwort als JSON aus und gibt ein JavaScript-Objekt zurück. […] Die JSON-Daten werden streng analysiert. Jeder fehlerhafte JSON wird zurückgewiesen und ein Analysefehler wird ausgelöst. […] Eine leere Antwort wird ebenfalls abgelehnt. Der Server sollte stattdessen eine Antwort von null oder {} zurückgeben.

Ihr serverseitiger Code gibt ein HTML-Snippet mit 200 OKStatus zurück. jQuery erwartete einen gültigen JSON und löst daher den Fehler-Rückruf aus, über den er sich beschwert parseerror.

Die Lösung besteht darin, den dataTypeParameter aus Ihrem jQuery-Code zu entfernen und den serverseitigen Code zurückzugeben:

Content-Type: application/javascript

alert("Record Deleted");

Ich würde jedoch eher vorschlagen, eine JSON-Antwort zurückzugeben und die Nachricht im Erfolgsrückruf anzuzeigen:

Content-Type: application/json

{"message": "Record deleted"}
Salman A.
quelle
1
Vielen Dank für Ihre Antwort. Können Sie mir bitte eine Sache sagen, wie ich den JSON-Wert vom Code dahinter zurückgeben kann? Ich benutze Asp.net mit C #. Dies hat mein Problem gelöst, kann mich aber auch darüber informieren.
Pankaj Mishra
1
@Pankaj: Es ist besser, wenn Sie es als eine andere Frage posten. Aber kurze Antwort: Zwei Möglichkeiten, dies zu tun (i), anstatt dass $.ajaxSie es versuchen können $.getScript. In das serverseitige C # -Skript setzen Sie einfach alert('Record Deleted');(kein <script>Tag) und setzen den ContentType Ihres C # -Skripts auf text/javascript. $.ajaxkönnte auch funktionieren, aber ich kann mich nicht erinnern, wie, vielleicht müssen Sie nur ändern dataType: 'script',. Möglicherweise benötigen Sie den Erfolgshandler nicht mehr.
Salman A
3
Diese Antwort ist möglicherweise nicht vollständig. Gerade habe ich meinen JSON bei jsonlint.com validiert. Es heißt ausdrücklich, dass es sich um einen vaild json handelt, aber dennoch wird ein "Fehler" -Ereignis mit xhr.status 200 ausgelöst. Welche anderen Gründe können da sein? - Ramesh Pareek gerade bearbeiten
Ramesh Pareek
2
Oder Sie können einfach den Parameter "dataType: json" löschen
Piero Alberto
1
Ich bin auf dasselbe Problem gestoßen, ohne bei der Verwendung einen Datentyp anzugeben $.post. In diesem Fall errät jquery einen Datentyp und tritt dann auf, wenn das Parsen fehlschlägt . Dies ist eine wirklich böse, schwer zu findende Gotcha. Ich habe es behoben, indem ich den Datentyp auf gesetzt habe "text".
Mashmagar
31

Ich hatte etwas Glück mit der Verwendung mehrerer durch Leerzeichen getrennter dataTypes ( jQuery 1.5+ ). Wie in:

$.ajax({
    type: 'POST',
    url: 'Jqueryoperation.aspx?Operation=DeleteRow',
    contentType: 'application/json; charset=utf-8',
    data: json,
    dataType: 'text json',
    cache: false,
    success: AjaxSucceeded,
    error: AjaxFailed
});
jaketrent
quelle
1
Basierend auf der JQuery-Dokumentation versucht eine Kurzzeichenfolge wie "jsonp xml" zunächst, von jsonp in xml zu konvertieren, und andernfalls konvertiert sie von jsonp in Text und dann von Text in xml. Es wird also zuerst versucht, Text an json zu verbergen, und wenn dies fehlschlägt, wird es einfach als Text behandelt?
anIBMer
29

Sie müssen lediglich den Datentyp "json" in Ihrem AJAX-Aufruf entfernen

$.ajax({
    type: 'POST',
    url: 'Jqueryoperation.aspx?Operation=DeleteRow',
    contentType: 'application/json; charset=utf-8',
    data: json,
    dataType: 'json', //**** REMOVE THIS LINE ****//
    cache: false,
    success: AjaxSucceeded,
    error: AjaxFailed
});
Philippe Genois
quelle
22

Dies ist nur zur Veranschaulichung, da ich auf diesen Beitrag gestoßen bin, als ich nach einer Lösung für mein Problem gesucht habe, die den OPs ähnlich war.

In meinem Fall wurde der Erfolg meiner jQuery Ajax-Anforderung aufgrund der Richtlinie mit demselben Ursprung in Chrome verhindert. Alles wurde behoben, als ich meinen Server (Node.js) geändert habe, um Folgendes zu tun:

response.writeHead(200,
          {
            "Content-Type": "application/json",
            "Access-Control-Allow-Origin": "http://localhost:8080"
        });

Es hat mich buchstäblich eine Stunde gekostet, meinen Kopf gegen die Wand zu schlagen. Ich fühle mich dumm ...

Corvin
quelle
1
Danke Peter, ich hatte das gleiche Problem und die Warnmeldung auf der Browserkonsole ist für mich verwirrt. Soweit ich weiß, blockiert das CORS die Sendeanforderung (unter Verwendung der Optionsmethodenaushandlung), macht es keinen Sinn, diese Blockierung nach Abschluss der Operation nach Abschluss durchzuführen. Vielleicht ist ein benutzerdefiniertes Browserverhalten .. Ich habe mit Firefox getestet. Danke, Ihre Lösung hat mein Problem gelöst.
Danipenaperez
15

Ich gehe davon aus, dass Ihre Aspx-Seite kein JSON-Objekt zurückgibt. Ihre Seite sollte ungefähr so ​​aussehen (page_load)

var jSon = new JavaScriptSerializer();
var OutPut = jSon.Serialize(<your object>);

Response.Write(OutPut);

Versuchen Sie auch, Ihr AjaxFailed zu ändern:

function AjaxFailed (XMLHttpRequest, textStatus) {

}

textStatus sollte Ihnen die Art des Fehlers geben, den Sie erhalten.

LeftyX
quelle
12

Ich habe dieses Problem mit einer aktualisierten jQuery-Bibliothek konfrontiert. Wenn die Servicemethode nichts zurückgibt, bedeutet dies, dass der Rückgabetyp lautet void.

Dann erwähnen Sie bitte in Ihrem Ajax-Anruf dataType='text'.

Es wird das Problem lösen.

Suresh Vadlakonda
quelle
8

Sie müssen nur dataType: 'json'aus Ihrem Header entfernen, wenn Ihre implementierte Webdienstmethode ungültig ist.

In diesem Fall erwartet der Ajax-Aufruf keinen JSON-Rückgabedatentyp.

Bilel Omrani
quelle
4

Verwenden Sie den folgenden Code, um sicherzustellen, dass die Antwort im JSON-Format (PHP-Version) vorliegt ...

header('Content-Type: application/json');
echo json_encode($return_vars);
exit;
Terry Lin
quelle
4

Ich hatte das gleiche Problem. Mein Problem war, dass mein Controller anstelle von JSON einen Statuscode zurückgab. Stellen Sie sicher, dass Ihr Controller Folgendes zurückgibt:

public JsonResult ActionName(){
   // Your code
   return Json(new { });
}
Alexander Suleymanov
quelle
3

Ich habe das ähnliche Problem, aber als ich versuchte, den Datentyp 'json' zu entfernen, habe ich immer noch das Problem. Mein Fehler wird anstelle des Erfolgs ausgeführt

function cmd(){
    var data = JSON.stringify(display1());
    $.ajax({
        type: 'POST',
        url: '/cmd',
        contentType:'application/json; charset=utf-8',
        //dataType:"json",
        data: data,
        success: function(res){
                  console.log('Success in running run_id ajax')
                  //$.ajax({
                   //   type: "GET",
                   //   url: "/runid",
                   //   contentType:"application/json; charset=utf-8",
                   //   dataType:"json",
                   //   data: data,
                   //  success:function display_runid(){}
                  // });
        },
        error: function(req, err){ console.log('my message: ' + err); }
    });
}
Rakesh Kumar
quelle
Ich sehe das Gleiche. Eine leere Antwort mit einem 200-Code löst immer noch den Fehlerbehandler aus.
DoubleJosh
2

Eine andere Sache, die die Dinge für mich durcheinander gebracht hat, war die Verwendung localhostvon 127.0.0.1 oder umgekehrt. Anscheinend kann JavaScript keine Anfragen von einem zum anderen verarbeiten.

Paul
quelle
2

Sehen Sie das . Es ist auch ein ähnliches Problem. Ich habe es versucht.

Nicht entfernen dataType: 'JSON',

Hinweis: Nur JSON-Format in PHP-Datei wiedergeben, wenn Sie nur PHP-Echo verwenden. Ihr Ajax-Code gibt 200 zurück

Inderjeet
quelle
1

Ich hatte das gleiche Problem. Dies lag daran, dass meine JSON-Antwort einige Sonderzeichen enthält und die Serverdatei nicht mit UTF-8 codiert wurde. Daher wurde beim Ajax-Aufruf davon ausgegangen, dass dies keine gültige JSON-Antwort ist.

Mehdi Izcool
quelle
1

Wenn Sie JSON immer vom Server zurückgeben (keine leeren Antworten), dataType: 'json'sollte dies funktionieren und contentTypewird nicht benötigt. Stellen Sie jedoch sicher, dass die JSON-Ausgabe ...

jQuery AJAX wirft einen 'Parseerror' auf gültigen, aber unserialisierten JSON!

Fabian von Ellerts
quelle
-1

Ihr Skript erfordert eine Rückgabe im JSON-Datentyp.

Versuche dies:

private string test() {
  JavaScriptSerializer js = new JavaScriptSerializer();
 return js.Serialize("hello world");
}
Kashif Faraz
quelle
-9

Versuchen Sie Folgendes

$.ajax({
    type: 'POST',
    url: 'Jqueryoperation.aspx?Operation=DeleteRow',
    contentType: 'application/json; charset=utf-8',
    data: { "Operation" : "DeleteRow", 
            "TwitterId" : 1 },
    dataType: 'json',
    cache: false,
    success: AjaxSucceeded,
    error: AjaxFailed
});

ODER

$.ajax({
    type: 'POST',
    url: 'Jqueryoperation.aspx?Operation=DeleteRow&TwitterId=1',
    contentType: 'application/json; charset=utf-8',
    dataType: 'json',
    cache: false,
    success: AjaxSucceeded,
    error: AjaxFailed
});

Verwenden Sie doppelte Anführungszeichen anstelle von einfachen Anführungszeichen im JSON-Objekt. Ich denke, das wird das Problem lösen.

Salman Riaz
quelle