Maison > interface Web > js tutoriel > Implémentation de types natifs Ajax MIME (avec code)

Implémentation de types natifs Ajax MIME (avec code)

php中世界最好的语言
Libérer: 2018-03-30 15:11:31
original
1574 Les gens l'ont consulté

Cette fois, je vais vous présenter l'implémentation native d'Ajax de type MIME (avec code). Quelles sont les précautions pour implémenter le type MIME d'Ajax natif Voici un cas pratique, jetons un coup d'oeil.

Description du problème

L'exemple suivant est un code Ajax post request, ce code est en cours d'exécution dans le test Lorsque , j'ai découvert que le code d'état renvoyé était 400, ce qui était une demande que le serveur ne pouvait pas comprendre. Après l'avoir vérifié et modifié, 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));
}
Copier après la connexion

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));
}
Copier après la connexion
La différence entre ces deux morceaux de code est-ce qu'après modification Le code supprime le traitement des données

variable et modifie les paramètres passés en envoi à la variable params

Résolution de questions

Le problème est résolu, mais une question se pose dans mon esprit. Lorsque j'utilisais Ajax natif auparavant, lorsque la méthode était post, les paramètres passés étaient sous la forme "name=123&age=32". pourquoi est-il acceptable 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 d'une requête, les paramètres passés sont erronés. Quand je l'ai rencontré cette fois, c'est parce que l'arrière-plan n'a pas ajouté de traitement pour cette requête

Je pense que vous maîtrisez la méthode après avoir lu le cas. dans cet article, veuillez prêter attention aux choses plus excitantes. D'autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

Comment écrire l'expression régulière pour déterminer le format de la carte d'identité et du numéro de carte bancaire

Comment pour vérifier l'expression régulière de JS Entier positif non nul

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal