web-dev-qa-db-fra.com

Comment envoyer JSON au lieu d'une chaîne de requête avec $ .ajax?

Quelqu'un peut-il expliquer de manière simple comment faire en sorte que jQuery envoie un JSON réel au lieu d'une chaîne de requête?

$.ajax({
    url      : url,
    dataType : 'json', // I was pretty sure this would do the trick
    data     : data,
    type     : 'POST',
    complete : callback // etc
});

En fait, cela convertira votre JSON soigneusement préparé en une chaîne de requête. Un des inconvénients est que tout array: [] de votre objet sera converti en array[]: [], probablement à cause des limites de la requête.

164
Redsandro

Vous devez utiliser JSON.stringify pour sérialiser d'abord votre objet au format JSON, puis spécifier le paramètre contentType afin que votre serveur comprenne qu'il s'agit de JSON. Cela devrait faire l'affaire:

_$.ajax({
    url: url,
    type: "POST",
    data: JSON.stringify(data),
    contentType: "application/json",
    complete: callback
});
_

Notez que l’objet JSON est disponible de manière native dans les navigateurs prenant en charge JavaScript 1.7/ECMAScript 5 ou version ultérieure. Si vous avez besoin d’un support existant, vous pouvez utiliser json2 .

243
mekwall

Non, l'option dataType sert à analyser les données reçues.

Pour publier le code JSON, vous devez le définir vous-même via JSON.stringify et définissez l'option processData sur false.

_$.ajax({
    url: url,
    type: "POST",
    data: JSON.stringify(data),
    processData: false,
    contentType: "application/json; charset=UTF-8",
    complete: callback
});
_

Notez que tous les navigateurs ne prennent pas en charge l'objet JSON et que, bien que jQuery ait _.parseJSON_, il n'a pas de stringifier inclus; vous aurez besoin d'une autre bibliothèque polyfill.

26
Bergi

Bien que je sache que de nombreuses architectures telles que ASP.NET MVC intègrent une fonctionnalité permettant de gérer JSON.stringify en tant que contentType, ma situation est un peu différente, ce qui pourrait peut-être aider quelqu'un à l'avenir. Je sais que cela m'aurait épargné des heures!

Étant donné que mes demandes http sont traitées par une API CGI d’IBM (environnement AS400) sur un sous-domaine différent, ces demandes sont cross Origin, d’où le jsonp. J'envoie réellement mon ajax via un ou plusieurs objets javascript. Voici un exemple de mon ajax POST:

 var data = {USER : localProfile,  
        INSTANCE : "HTHACKNEY",  
        PAGE : $('select[name="PAGE"]').val(), 
        TITLE : $("input[name='TITLE']").val(), 
        HTML : html,
        STARTDATE : $("input[name='STARTDATE']").val(), 
        ENDDATE : $("input[name='ENDDATE']").val(),
        ARCHIVE : $("input[name='ARCHIVE']").val(), 
        ACTIVE : $("input[name='ACTIVE']").val(), 
        URGENT : $("input[name='URGENT']").val(), 
        AUTHLST :  authStr};
        //console.log(data);
       $.ajax({
            type: "POST",
           url:   "http://www.domian.com/webservicepgm?callback=?",
           data:  data,
           dataType:'jsonp'
       }).
       done(function(data){
         //handle data.WHATEVER
       });
5
yardpenalty

Si vous renvoyez ceci à asp.net et que vous avez besoin des données de request.form [], vous devez définir le type de contenu sur "application/x-www-form-urlencoded; charset = utf-8".

Message original ici

Deuxièmement, supprimez le type de données. Si vous ne vous attendez pas à recevoir un retour, le POST attendra environ 4 minutes avant d’échouer. Voir ici

1
Tod