Comment utiliser les types MIME dans l'implémentation native d'Ajax (tutoriel graphique)

Ci-dessous, je partagerai avec vous un article sur l'utilisation des types MIME dans l'implémentation native d'Ajax. Il a une bonne valeur de référence et j'espère qu'il sera utile à tout le monde.

Description du problème

L'exemple suivant est le code d'une requête de publication Ajax. Lorsque ce code est testé et exécuté, il s'avère que. le renvoyé Le code d'état est 400, une requête que le serveur ne peut pas comprendre. Après l'avoir vérifié et modifié ultérieurement, j'ai constaté qu'il me suffisait de modifier légèrement le code suivant

Code original

var send = function (url, params, fn) {
  var me = this;
  var xhr = null;
  var data = '';
  fn = fn || function() {};
  params = params || {};
  for(var item in params) {
   data += item + '=' + params[item] + '&';
  }
  if(data[data.length - 1] == '&') {
   data = data.slice(0, data.length - 1);
  }
  if(window.XMLHttpRequest) {
   xhr = new XMLHttpRequest();
  }else if(window.ActiveXObject) {
   xhr= new ActiveXObject("Microsoft.XMLHTTP");
  }
  xhr.open("post", url, true);
  xhr.setRequestHeader("Content-type", "application/json");
  xhr.onreadystatechange = function () {
   if(xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 304)) {
    fn(JSON.parse(xhr.responseText));
   }
  };
  xhr.send(JSON.stringify(params));
}

Le code modifié

var send = function (url, params, fn) {
    var me = this;
    var xhr = null;
    fn = fn || function() {};
    params = params || {};
    if(window.XMLHttpRequest) {
      xhr = new XMLHttpRequest();
    }else if(window.ActiveXObject) {
      xhr= new ActiveXObject("Microsoft.XMLHTTP");
    }
    xhr.open("post", url, true);
    xhr.setRequestHeader("Content-type", "application/json");
    xhr.onreadystatechange = function () {
      if(xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 304)) {
        fn(JSON.parse(xhr.responseText));
      }
    };
    xhr.send(JSON.stringify(params));
}

La différence entre ces deux morceaux de code est que le code modifié supprime le traitement du variable data et les paramètres transmis dans send ont été remplacés par la variable params

Problème résolu

Le problème a été résolu, mais des questions se sont posées dans mon Attention, lors de l'utilisation d'Ajax natif auparavant, lorsque la méthode était postée, les paramètres transmis étaient sous la forme de "name=123&age=32", alors pourquoi est-il OK de transmettre un objet JSON sérialisé maintenant ?

À ce moment-là, j'ai remarqué le type MIME que j'ai ajouté, c'est là que le type de contenu est défini, je l'ai défini sur "application/json", ce qui semble logique à ce moment-là. Le type MIME couramment utilisé auparavant était "application/x-www-form-urlencoded". Dans ce cas, les paramètres transmis par la méthode d'envoi doivent être "name=123&age=32". ~￣▽￣)~

Supplémentaire

Au fait, le code d'état 405, la dernière fois que je l'ai vu, était sur mon front end Lors de l'envoi de la demande, les paramètres transmis étaient erronés. Lorsque je l'ai rencontré cette fois, c'est parce que l'arrière-plan n'a pas ajouté le traitement de cette demande.

Ce qui précède est ce que j'ai compilé pour tout le monde. j'espère que cela sera utile à tout le monde à l'avenir.

Articles connexes :

Jquery's get, post, ajax, détails d'utilisation de la fonction getJSON

ajaxDemande de séquence de données de retour d'opération

JS basé sur l'utilisation de ajax informations d'opération

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!