Senden Sie JSON-Daten mit jQuery

73

Warum Code unten gesendete Daten City=Moscow&Age=25anstelle des JSON-Formats?

var arr = {City:'Moscow', Age:25};
$.ajax(
   {
        url: "Ajax.ashx",
        type: "POST",
        data: arr,
        dataType: 'json',
        async: false,
        success: function(msg) {
            alert(msg);
        }
    }
);
Neir0
quelle
2
dataType ist das, was zurückgegeben wird, nicht das, was gesendet wird!
Gal
Versuchen Sie, 'dataType' vor Daten zu setzen ... nicht sicher.
DaGrevis
1
Um zu verhindern, datadass in das Abfragezeichenfolgenformat konvertiert wird processData: false. Siehe api.jquery.com/jquery.ajax/#sending-data-to-server
Paul

Antworten:

179

Da Sie weder den Anforderungsinhaltstyp noch die korrekte JSON-Anforderung angegeben haben. Hier ist der richtige Weg, um eine JSON-Anfrage zu senden:

var arr = { City: 'Moscow', Age: 25 };
$.ajax({
    url: 'Ajax.ashx',
    type: 'POST',
    data: JSON.stringify(arr),
    contentType: 'application/json; charset=utf-8',
    dataType: 'json',
    async: false,
    success: function(msg) {
        alert(msg);
    }
});

Dinge zu beachten:

  • Verwendung der JSON.stringifyMethode zum Konvertieren eines Javascript-Objekts in eine native JSON-Zeichenfolge, die in moderne Browser integriert ist. Wenn Sie ältere Browser unterstützen möchten, müssen Sie möglicherweise json2.js einschließen
  • Angeben des Anforderungsinhaltstyps mithilfe der contentTypeEigenschaft, um dem Server die Absicht anzuzeigen, eine JSON-Anforderung zu senden
  • Die dataType: 'json'Eigenschaft wird für den Antworttyp verwendet, den Sie vom Server erwarten. jQuery ist intelligent genug, um es aus dem Server- Antwortheader zu erratenContent-Type . Wenn Sie also einen Webserver haben, der das HTTP-Protokoll mehr oder weniger respektiert und auf Content-Type: application/jsonIhre Anfrage reagiert , analysiert jQuery die Antwort automatisch in ein Javascript-Objekt im successRückruf, sodass Sie die dataTypeEigenschaft nicht angeben müssen .

Dinge, bei denen Sie vorsichtig sein sollten:

  • Was Sie aufrufen, arrist kein Array . Es ist ein Javascript-Objekt mit Eigenschaften ( Cityund Age). Arrays sind []in Javascript mit gekennzeichnet. Zum Beispiel [{ City: 'Moscow', Age: 25 }, { City: 'Paris', Age: 30 }]ist ein Array von 2 Objekten.
Darin Dimitrov
quelle
Hallo, ich habe es in meinem Code getestet, aber es funktioniert nicht pastie.org/pastes/7975866/text warum?
Michelangelo
Technisch gesehen sind Objekte in JavaScript nur assoziative Arrays. Obwohl es verwirrend ist, ein Objekt als Array in JavaScript aufzurufen, ist dies kein Fehler. Weitere Informationen finden Sie unter: JavaScript-Datenstrukturen
Nadav
@ Nadav die Tatsache, dass es verwirrend ist, ist mehr als genug Grund, es nicht zu tun.
Madbreaks
@Darin rettete meinen Tag, danke
anshul
9

Weil jQuery standardmäßig Objekte serialisiert, die als dataParameter an übergeben werden $.ajax. Es wird verwendet $.param, um die Daten in eine Abfragezeichenfolge zu konvertieren.

Aus den jQuery-Dokumenten für $.ajax:

[das dataArgument] wird in eine Abfragezeichenfolge konvertiert, wenn nicht bereits eine Zeichenfolge

Wenn Sie JSON senden möchten, müssen Sie es selbst codieren:

data: JSON.stringify(arr);

Beachten Sie, dass dies JSON.stringifynur in modernen Browsern vorhanden ist. Informationen zur Legacy-Unterstützung finden Sie in json2.js

einsamer Tag
quelle
4

Ich habe eine kurze Convenience-Funktion zum Posten von JSON geschrieben.

$.postJSON = function(url, data, success, args) {
  args = $.extend({
    url: url,
    type: 'POST',
    data: JSON.stringify(data),
    contentType: 'application/json; charset=utf-8',
    dataType: 'json',
    async: true,
    success: success
  }, args);
  return $.ajax(args);
};

$.postJSON('test/url', data, function(result) {
  console.log('result', result);
});
Aram Kocharyan
quelle
1

Sie müssen den richtigen Inhaltstyp festlegen und Ihr Objekt stringifizieren.

var arr = {City:'Moscow', Age:25};
$.ajax({
    url: "Ajax.ashx",
    type: "POST",
    data: JSON.stringify(arr),
    dataType: 'json',
    async: false,
    contentType: 'application/json; charset=utf-8',
    success: function(msg) {
        alert(msg);
    }
});
Amrit
quelle
0

Es wird serialisiert, sodass der URI standardmäßig die Name-Wert-Paare in der POST-Anforderung lesen kann. Sie können versuchen, processData: false für Ihre Parameterliste festzulegen. Ich bin mir nicht sicher, ob das helfen würde.

Picus
quelle