Qu'est-ce que le type de contenu et le type de données dans une requête AJAX?

179

Qu'est-ce que le type de contenu et le type de données dans une requête POST? Supposons que j'ai ceci:

$.ajax({
    type : "POST",
    url : /v1/user,
    datatype : "application/json",
    contentType: "text/plain",
    success : function() {

    },
    error : function(error) {

    },

Est contentTypece que nous envoyons? Donc, ce que nous envoyons dans l'exemple ci-dessus est JSON et ce que nous recevons est du texte brut? Je ne comprends pas vraiment.

jquery user2759697
la source

Réponses:

304

contentTypeest le type de données que vous envoyez, c'est donc application/json; charset=utf-8une donnée courante, telle application/x-www-form-urlencoded; charset=UTF-8quelle, qui est la valeur par défaut.

dataTypeest ce que vous vous attendez à partir du serveur: json, html, text, etc. jQuery utiliser pour savoir comment remplir le paramètre de la fonction de réussite.

Si vous publiez quelque chose comme:

{"name":"John Doe"}

et en attendant de revenir:

{"success":true}

Ensuite, vous devriez avoir:

var data = {"name":"John Doe"}
$.ajax({
    dataType : "json",
    contentType: "application/json; charset=utf-8",
    data : JSON.stringify(data),
    success : function(result) {
        alert(result.success); // result is an object which is created from the returned JSON
    },
});

Si vous vous attendez à ce qui suit:

<div>SUCCESS!!!</div>

Alors tu devrais faire:

var data = {"name":"John Doe"}
$.ajax({
    dataType : "html",
    contentType: "application/json; charset=utf-8",
    data : JSON.stringify(data),
    success : function(result) {
        jQuery("#someContainer").html(result); // result is the HTML text
    },
});

Encore un - si vous souhaitez publier:

name=John&age=34

Alors ne prenez pas stringifyles données et faites:

var data = {"name":"John", "age": 34}
$.ajax({
    dataType : "html",
    contentType: "application/x-www-form-urlencoded; charset=UTF-8", // this is the default value, so it's optional
    data : data,
    success : function(result) {
        jQuery("#someContainer").html(result); // result is the HTML text
    },
});

Joe Enos
la source

merci en effet :) quel est ce "succès": vrai. est-ce un autre fichier json dans le backend? comment se fait ce succès? c'est ce que j'aime vraiment savoir

user2759697

C'est juste un objet ordinaire - il est fabriqué comme le serveur décide de le faire. Un serveur Web peut envoyer tout ce qui lui ressemble - HTML, texte ou, dans ce cas, un objet JSON avec une seule propriété avec le nom «succès» et la valeur true. Je ne peux pas deviner quel est le cadre de votre API, mais en C # sur ASP.NET MVC, ce serait quelque chose d'aussi simple que

[HttpPost]public JsonResult user(Person postedPerson) { /* Save postedPerson to DB */ return Json(new { success = true }); }

Joe Enos

Faites attention que vous devez utiliser à la $.ajax({ dataType : "html", ... place de $.ajax({ datatype : "html",... Donc T majuscule dans le mot Type est important. Vérifiez jQuery API

Vadim Levkovsky

@Jacques je suppose qu'ils auraient pu faire requestContentTypeet responseDataType, mais vous ne serez pas assez confus dans la réalité, une fois que vous avez fait une ou deux fois, et vous comprenez l'API, pour faire la saisie supplémentaire utile.

Joe Enos

@stom La question et ma réponse étaient spécifiques à POST, mais si je me souviens bien, si vous passez un objet simple ordinaire comme données sur un GET, il le transformera en une chaîne de requête avec des paires clé-valeur. Je ne sais pas ce qui se passerait si vous aviez un objet complexe avec des valeurs imbriquées - mais cela ne devrait pas être difficile d'essayer si vous êtes curieux. Cependant, je ne ferais jamais ça dans la vraie vie - je n'utilise que très rarement AJAX sur un GET de toute façon.

Joe Enos

De la documentation jQuery - http://api.jquery.com/jQuery.ajax/

contentType Lors de l'envoi de données au serveur, utilisez ce type de contenu.

dataType Le type de données que vous attendez du serveur. Si aucun n'est spécifié, jQuery essaiera de l'inférer en fonction du type MIME de la réponse

"text": une chaîne de texte brut.

Vous voulez donc que contentType soit application/jsonet dataType soit text:

$.ajax({
    type : "POST",
    url : /v1/user,
    dataType : "text",
    contentType: "application/json",
    data : dataAttribute,
    success : function() {

    },
    error : function(error) {

    }
});

Richard Dalton
la source

merci en effet et quelle est cette application dans application / json. est-ce un chemin?

user2759697

@ user2759697 C'est juste une partie du type MIME défini pour JSON. Voir cette question - stackoverflow.com/questions/477816/…

Richard Dalton

C'est ce que j'aime à propos de SO ... obtenir un représentant pour avoir déclaré l'évidence ...> _ <

Christoph

Voir http://api.jquery.com/jQuery.ajax/ , il y a mention du type de données et contentType.

Ils sont tous deux utilisés dans la demande au serveur afin que le serveur sache quel type de données recevoir / envoyer.

Jono
la source