So verwenden Sie MIME-Typen in der nativen Implementierung von Ajax

Das Folgende ist ein Artikel über die Verwendung von MIME-Typen in der nativen Implementierung von Ajax. Er hat einen guten Referenzwert und ich hoffe, dass er für alle hilfreich sein wird.

Problembeschreibung

Das folgende Beispiel ist ein Ajax-Post-Request-Code. Wenn dieser Code getestet und ausgeführt wird, wird festgestellt, dass er zurückgegeben wird Der Statuscode ist 400, eine Anfrage, die der Server nicht verstehen kann. Nachdem ich ihn später überprüft und geändert habe, habe ich festgestellt, dass der folgende Code nur geringfügig geändert werden muss

Originalcode

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

Der geänderte Code

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

Der Unterschied zwischen diesen beiden Codes besteht darin, dass der geänderte Code die Verarbeitung der Datenvariablen entfernt und die Parameter ändert, die beim Senden an die Parametervariablen

Fragenlösung übergeben werden

Das Problem wurde gelöst, aber in meinem Kopf taucht eine Frage auf. Als ich zuvor natives Ajax verwendet habe, hatten die übergebenen Parameter die Form „name=123&age=32“. Das war's , warum ist es also jetzt in Ordnung, ein serialisiertes JSON-Objekt zu übergeben?

Zu diesem Zeitpunkt ist mir der von mir hinzugefügte MIME-Typ aufgefallen, bei dem ich den Inhaltstyp auf „application/json“ festgelegt habe, was mir zu diesem Zeitpunkt sinnvoll erscheint Der zuvor häufig verwendete MIME-Typ war „application/x-www-form-urlencoded“. In diesem Fall müssen die von der Sendemethode übergebenen Parameter „name=123&age=32“ sein. ~￣▽￣)~

Ergänzung

Übrigens war der Statuscode 405, als ich ihn das letzte Mal gesehen habe, auf meinem Frontend Beim Senden einer Anfrage waren die übergebenen Parameter falsch, weil der Hintergrund keine Verarbeitung für diese Anfrage hinzugefügt hat Ich hoffe, es wird für das Lernen aller hilfreich sein. Weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website!

Verwandte Empfehlungen:

Native JS-Schreibfunktion für Ajax-Anforderungsfunktionen

Einführung in die Verwendung des asynchronen Datei-Uploads von ajaxFileUpload

Einführung in Ajax Get- und Post-Anfragen

Das obige ist der detaillierte Inhalt vonSo verwenden Sie MIME-Typen in der nativen Implementierung von Ajax. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!