So verwenden Sie MIME-Typen in der nativen Implementierung von Ajax (grafisches Tutorial)

Jetzt werde ich einen Artikel über die Verwendung von MIME-Typen in der nativen Implementierung von Ajax mit Ihnen teilen. 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 Codeteilen besteht darin, dass durch den geänderten Code die Verarbeitung der Datenvariablen und der übergebenen Informationen entfällt in send Der Parameter wurde in die Variable params geändert

Problem gelöst

Das Problem wurde gelöst, aber es kamen mir Zweifel, dass ich es verwendet habe Vorher In nativem Ajax haben die übergebenen Parameter beim Posten der Methode die Form „name=123&age=32“. Warum ist es also in Ordnung, jetzt 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 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, dass dies der Fall ist Es wird in Zukunft für alle hilfreich sein.

Verwandte Artikel:

Get, Post,

Ajax, getJSON-Funktionsnutzungsdetails von Jquery

AjaxDatensequenz zur Rückgabe der Operation anfordern

JS basierend auf der Verwendung von

AjaxOperationsinformationen

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