web-dev-qa-db-fra.com

Jquery Ajax Publier JSON sur le service Web

J'essaie de publier un objet JSON sur un service Web asp.net.

Mon json ressemble à ceci:

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

J'utilise json2.js pour stringyfy mon objet json.

et j'utilise jquery pour le poster sur mon webservice.

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

Je reçois l'erreur suivante:

"Primitive JSON invalide:

J'ai trouvé de nombreux articles sur ce sujet et il semble que ce soit un problème très courant, mais rien que j'essaie ne résout le problème.

Lorsque firebug, ce qui est posté sur le serveur ressemble à ceci:

marqueurs% 5B0% 5D% 5Bposition% 5D = 128.3657142857143 & marqueurs% 5B0% 5D% 5BmarkeurPosition% 5D = 7 & marqueurs% 5B1% 5D% 5Bposition% 5D = 235.1944023323615 & marqueurs% 5B1% 5D% 5Jose 5% du contenu en ordre 5D = 42,5978231292517 & marqueurs% 5B2% 5D% 5BmarkerPosition% 5D = -3

Ma fonction de service Web appelée est la suivante:

[WebMethod]
public string CreateMarkers(string markerArray)
{
    return "received markers";
}
jqueryajaxweb-servicesjson
224
Code Pharaoh

Vous avez mentionné l'utilisation de json2.js pour renforcer vos données, mais les données POSTed semblent être du code JSON URLEncoded. Vous l'avez peut-être déjà vu, mais ce message sur la primitive JSON non valide explique pourquoi le code JSON est en cours de codage URLEncodé.

Je conseillerais contre en passant une chaîne JSON brute, sérialisée manuellement dans votre méthode . ASP.NET va automatiquement désérialiser les données de la demande POST de la demande. Par conséquent, si vous sérialisez et envoyez manuellement une chaîne JSON à ASP.NET, vous devrez finalement sérialiser JSON votre JSON sérialisé. chaîne.

Je suggérerais quelque chose de plus dans ce sens:

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

Pour éviter le problème de primitive JSON non valide, il est essentiel de transmettre à jQuery une chaîne JSON pour le paramètre data, et non un objet JavaScript, afin que jQuery ne tente pas de code URLEncode pour vos données.

Côté serveur, faites correspondre les paramètres d'entrée de votre méthode à la forme des données que vous transmettez:

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

Vous pouvez également accepter un tableau, tel que Marker[] Markers, si vous préférez. Le désérialiseur utilisé par ASMX ScriptServices (JavaScriptSerializer) est assez flexible et fera de son mieux pour convertir vos données d'entrée dans le type côté serveur que vous spécifiez.

369
Dave Ward
  1. markers n'est pas un objet JSON. C'est un objet JavaScript normal.
  2. Lisez à propos de l'option data:) :

    Données à envoyer au serveur. Il est converti en une chaîne de requête , si ce n'est déjà une chaîne.

Si vous souhaitez envoyer les données au format JSON, vous devez d'abord les encoder:

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

jQuery ne convertit pas automatiquement les objets ou les tableaux en JSON.

Mais je suppose que le message d'erreur provient de l'interprétation de la réponse du service. Le texte que vous renvoyez n'est pas JSON. Les chaînes JSON doivent être placées entre guillemets. Donc, vous devez faire:

return "\"received markers\"";

Je ne sais pas si votre problème actuel est l'envoi ou la réception des données.

15
Felix Kling

J'ai essayé la solution de Dave Ward. La partie de données n'a pas été envoyée par le navigateur dans la partie des données utiles de la demande de publication, car contentType est défini sur "application/json". Une fois que j'ai enlevé cette ligne, tout a bien fonctionné.

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
Usha

J'ai rencontré celui-ci aussi et c'est ma solution.

Si vous rencontrez une exception d'objet JSON non valide lors de l'analyse des données, même si vous savez que votre chaîne JSON est correcte, stringifiez les données que vous avez reçues dans votre code ajax avant de les analyser au format JSON:

$.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 ...
2
Clare Panganoron

J'ai une requête,

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

    });

Je poste les informations de connexion dans JSON et j'obtiens une chaîne sous la forme "Success", mais je ne reçois pas la réponse.

1
Priya B