it-swarm.com.de

Wie kann ich JQuery zum Posten von JSON-Daten verwenden?

Ich möchte Json auf einem Webdienst auf demselben Server veröffentlichen. Aber ich weiß nicht, wie ich Json mit JQuery posten soll. Ich habe mit diesem Code versucht:

$.ajax({
    type: 'POST',
    url: '/form/',
    data: {"name":"jonas"},
    success: function(data) { alert('data: ' + data); },
    contentType: "application/json",
    dataType: 'json'
});

Mit diesem JQuery-Code werden die Daten jedoch nicht als Json auf dem Server empfangen. Dies sind die erwarteten Daten auf dem Server: {"name":"jonas"} aber mit JQuery erhält der Server name=jonas. Oder mit anderen Worten, es handelt sich um urlencodierte Daten und nicht um Json.

Gibt es eine Möglichkeit, die Daten im Json-Format anstelle von urlencodierten Daten mit JQuery zu veröffentlichen? Oder muss ich eine manuelle Ajax-Anfrage verwenden?

67
Jonas

Sie übergeben ein Objekt , keine JSON-Zeichenfolge . Wenn Sie ein Objekt übergeben, verwendet jQuery $.param um das Objekt in Name-Wert-Paare zu serialisieren.

Wenn Sie die Daten als Zeichenfolge übergeben, werden sie nicht serialisiert:

$.ajax({
    type: 'POST',
    url: '/form/',
    data: '{"name":"jonas"}', // or JSON.stringify ({name: 'jonas'}),
    success: function(data) { alert('data: ' + data); },
    contentType: "application/json",
    dataType: 'json'
});
130
lonesomeday

Basierend auf der Antwort von lonesomeday erstelle ich ein jpost, das bestimmte Parameter umschließt.

$.extend({
    jpost: function(url, body) {
        return $.ajax({
            type: 'POST',
            url: url,
            data: JSON.stringify(body),
            contentType: "application/json",
            dataType: 'json'
        });
    }
});

Verwendung:

$.jpost('/form/', { name: 'Jonh' }).then(res => {
    console.log(res);
});
8
Ninh Pham