Jquery Ajax Posting json zum Webservice


238

Ich versuche, ein JSON-Objekt auf einem asp.net-Webservice zu veröffentlichen.

Mein json sieht so aus:

var markers = { "markers": [
  { "position": "128.3657142857143", "markerPosition": "7" },
  { "position": "235.1944023323615", "markerPosition": "19" },
  { "position": "42.5978231292517", "markerPosition": "-3" }
]};

Ich verwende json2.js, um mein json-Objekt zu stringyfy.

und ich benutze jquery, um es auf meinem Webservice zu posten.

  $.ajax({
        type: "POST",
        url: "/webservices/PodcastService.asmx/CreateMarkers",
        data: markers,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(data){alert(data);},
        failure: function(errMsg) {
            alert(errMsg);
        }
  });

Ich erhalte die folgende Fehlermeldung:

"Ungültiges JSON-Grundelement:

Ich habe eine Reihe von Posts gefunden, die sich darauf beziehen, und es scheint ein wirklich häufiges Problem zu sein, aber nichts, was ich versuche, behebt das Problem.

Wenn Firebug, was auf dem Server gepostet wird, sieht es so aus:

Marker% 5B0% 5D% 5Bosition% 5D = 128.3657142857143 & Marker% 5B0% 5D% 5BmarkerPosition% 5D = 7 & Marker% 5B1% 5D% 5Bposition% 5D = 235.1944023323615 & Marker% 5B1% 5D% 5BmarkerPosition% 5D2 19% 5D = 42,5978231292517 & Marker% 5B2% 5D% 5BmarkerPosition% 5D = -3

Meine aufgerufene Webservice-Funktion lautet:

[WebMethod]
public string CreateMarkers(string markerArray)
{
    return "received markers";
}

'Fehler' wird unter den in api.jquery.com/jQuery.ajax aufgeführten Einstellungen nicht als mögliche Einstellung angegeben . Vielleicht haben Sie es stattdessen mit 'Fehler' verwechselt?
Danicotra

Antworten:


390

Sie haben erwähnt, dass Sie json2.js verwenden, um Ihre Daten zu stringifizieren, aber die POST-Daten scheinen URLEncoded JSON zu sein. Sie haben es möglicherweise bereits gesehen, aber dieser Beitrag über das ungültige JSON- Grundelement behandelt, warum JSON URLEncoded ist.

Ich würde raten , gegen Übergabe eines rohen, manuell serialisiert JSON - String in Ihre Methode . ASP.NET wird die POST-Daten der Anforderung automatisch von JSON deserialisieren. Wenn Sie also eine JSON-Zeichenfolge manuell serialisieren und an ASP.NET senden, müssen Sie Ihre JSON-serialisierte Zeichenfolge tatsächlich JSON-serialisieren.

Ich würde etwas mehr in diese Richtung vorschlagen:

var markers = [{ "position": "128.3657142857143", "markerPosition": "7" },
               { "position": "235.1944023323615", "markerPosition": "19" },
               { "position": "42.5978231292517", "markerPosition": "-3" }];

$.ajax({
    type: "POST",
    url: "/webservices/PodcastService.asmx/CreateMarkers",
    // The key needs to match your method's input parameter (case-sensitive).
    data: JSON.stringify({ Markers: markers }),
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(data){alert(data);},
    failure: function(errMsg) {
        alert(errMsg);
    }
});

Der Schlüssel zur Vermeidung des ungültigen primitiven JSON-Problems besteht darin, jQuery eine JSON-Zeichenfolge für das zu übergeben data Parameter und kein JavaScript-Objekt zu übergeben, damit jQuery nicht versucht, Ihre Daten mit URLEncode zu versehen.

Passen Sie auf der Serverseite die Eingabeparameter Ihrer Methode an die Form der Daten an, die Sie übergeben:

public class Marker
{
  public decimal position { get; set; }
  public int markerPosition { get; set; }
}

[WebMethod]
public string CreateMarkers(List<Marker> Markers)
{
  return "Received " + Markers.Count + " markers.";
}

Sie können auch ein Array akzeptieren Marker[] Markers, wenn Sie dies bevorzugen. Der von ASMX ScriptServices verwendete Deserializer (JavaScriptSerializer) ist ziemlich flexibel und unternimmt alles, um Ihre Eingabedaten in den von Ihnen angegebenen serverseitigen Typ zu konvertieren.


4
Sie haben geschrieben, "damit jQuery nicht versucht, Ihre Daten mit URLEncode zu versehen.", Aber es ist nicht korrekt. Um zu verhindern, dass jquery Ihre Daten urlencodiert, müssen Sie processData auf false setzen.
Softlion

8
Die Übergabe einer Zeichenfolge reicht aus, um zu verhindern, dass jQuery den Datenparameter URLEncodiert. Sie können processData auf false setzen, dies ist jedoch überflüssig (und dies allein zu tun, ohne eine JSON-Zeichenfolge für die Daten zu übergeben, reicht nicht aus).
Dave Ward

1
Das gleiche Problem (und die gleiche Antwort) gilt auch für Rails.
GregT

2
@ DaveWard Wird contentTypeberücksichtigt, wenn wir GET und nicht POST verwenden?
Royi Namir

@RoyiNamir Wenn Sie ASMX ScriptServices oder ASPX WebMethods verwenden, müssen Sie POST verwenden, damit diese JSON zurückgeben. Wenn Sie GET, Content-Type korrekt oder nicht erhalten, erhalten Sie stattdessen XML.
Dave Ward

18
  1. markersist kein JSON-Objekt. Es ist ein normales JavaScript-Objekt.
  2. Lesen Sie mehr über die data:Option :

    Daten, die an den Server gesendet werden sollen. Es wird in eine Abfragezeichenfolge konvertiert , wenn nicht bereits eine Zeichenfolge.

Wenn Sie die Daten als JSON senden möchten, müssen Sie sie zuerst codieren:

data: {markers: JSON.stringify(markers)}

jQuery konvertiert Objekte oder Arrays nicht automatisch in JSON.


Ich gehe jedoch davon aus, dass die Fehlermeldung von der Interpretation der Antwort des Dienstes stammt. Der Text, den Sie zurücksenden, ist nicht JSON. JSON-Zeichenfolgen müssen in doppelte Anführungszeichen gesetzt werden. Sie müssten also Folgendes tun:

return "\"received markers\"";

Ich bin nicht sicher, ob Ihr eigentliches Problem das Senden oder Empfangen der Daten ist.


Vielen Dank, dass Sie Felix geholfen haben. Ich dachte, dass ich durch Ausführen von Markern durch die JSON.stringyfy-Methode, die ich in eine Abfragezeichenfolge konvertiert habe, das getan habe, was Sie vorgeschlagen haben, aber leider funktioniert es nicht. Ich veröffentliche Folgendes nicht.
Code Pharao

Marker =% 7B% 22 Marker% 22% 3A% 5B% 7B% 22Position% 22% 3A% 22128.3657142857143% 22% 2C% 22markerPosition% 22% 3A% 227% 22% 7D% 2C% 7B% 22Position% 22% 3A% 22235.1944023323615 % 22% 2C% 22markerPosition% 22% 3A% 2219% 22% 7D% 2C% 7B% 22position% 22% 3A% 2242,5978231292517% 22% 2C% 22markerPosition% 22% 3A% 22-3% 22% 7D% 5D% 7D
Code Pharao

@ Dreamguts: Es ist mir ein bisschen unklar, was du willst. Möchten Sie markersals JSON-Zeichenfolge senden ?
Felix Kling

Hallo Felix, ja, ich möchte das Markierungsobjekt als JSON-Zeichenfolge senden, damit ich es in meinem Webservice verwenden kann.
Code Pharao

@ Dreamguts: Dann sollte es so funktionieren. Auch der "Code", den Sie im Kommentar gepostet haben, sieht in Ordnung aus. Natürlich muss man es auf der Serverseite richtig dekodieren und vielleicht muss man den Namen des Parameters ändern, ich weiß es nicht.
Felix Kling

3

Ich habe Dave Wards Lösung ausprobiert. Der Datenteil wurde im Nutzdatenbereich der Post-Anfrage nicht vom Browser gesendet, da der Inhaltstyp auf eingestellt ist "application/json". Nachdem ich diese Zeile entfernt hatte, funktionierte alles hervorragend.

var markers = [{ "position": "128.3657142857143", "markerPosition": "7" },

               { "position": "235.1944023323615", "markerPosition": "19" },

               { "position": "42.5978231292517", "markerPosition": "-3" }];

$.ajax({

    type: "POST",
    url: "/webservices/PodcastService.asmx/CreateMarkers",
    // The key needs to match your method's input parameter (case-sensitive).
    data: JSON.stringify({ Markers: markers }),
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(data){alert(data);},
    failure: function(errMsg) {
        alert(errMsg);
    }
});

2

Ich bin auch diesem begegnet und dies ist meine Lösung.

Wenn beim Parsen von Daten eine ungültige JSON-Objektausnahme auftritt, obwohl Sie wissen, dass Ihre JSON-Zeichenfolge korrekt ist, stringifizieren Sie die Daten, die Sie in Ihrem Ajax-Code erhalten haben, bevor Sie sie in JSON analysieren:

$.post(CONTEXT+"servlet/capture",{
        yesTransactionId : yesTransactionId, 
        productOfferId : productOfferId
        },
        function(data){
            try{
                var trimData = $.trim(JSON.stringify(data));
                var obj      = $.parseJSON(trimData);
                if(obj.success == 'true'){ 
                    //some codes ...

1

Ich habe Anfrage,

$("#login-button").click(function(e){ alert("hiii");

        var username = $("#username-field").val();
        var password = $("#username-field").val();

        alert(username);
        alert("password" + password);



        var markers = { "userName" : "admin","password" : "admin123"};
        $.ajax({
            type: "POST",
            url: url,
            // The key needs to match your method's input parameter (case-sensitive).
            data: JSON.stringify(markers),
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function(data){alert("got the data"+data);},
            failure: function(errMsg) {
                alert(errMsg);
            }
        });

    });

Ich poste die Anmeldedaten in json und erhalte eine Zeichenfolge als "Success", aber ich erhalte keine Antwort.


1
Dies ist nicht die Antwort auf die Frage. Wenn Sie die Frage stellen möchten, gehen Sie zum Menü "Frage" und klicken Sie auf "Frage stellen". Wenn Ihre Frage mit dieser Frage zusammenhängt, geben Sie den Referenzlink in Ihrer Frage an.
Mittal Patel

-2

Bitte folgen Sie diesem Befehl durch einen Ajax-Aufruf des Webservices von Java var param = {feildName: feildValue}; JSON.stringify ({data: param})

$.ajax({
            dataType    : 'json',
            type        : 'POST',
            contentType : 'application/json',
            url         : '<%=request.getContextPath()%>/rest/priceGroups',
            data        : JSON.stringify({data : param}),
            success     : function(res) {
                if(res.success == true){
                    $('#alertMessage').html('Successfully price group created.').addClass('alert alert-success fade in');
                    $('#alertMessage').removeClass('alert-danger alert-info');
                    initPriceGroupsList();
                    priceGroupId = 0;
                    resetForm();                                                                    
                }else{                          
                    $('#alertMessage').html(res.message).addClass('alert alert-danger fade in');
                }
                $('#alertMessage').alert();         
                window.setTimeout(function() { 
                    $('#alertMessage').removeClass('in');
                    document.getElementById('message').style.display = 'none';
                }, 5000);
            }
        });

hier, wie man Objekte auflistet, die in json an den Ajax-Aufruf von Java Webservice übergeben werden.
Ravi Panchal
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.