Heim >Web-Frontend >js-Tutorial >Wie kann ich Daten an einen Dienst in Axios übergeben und sicherstellen, dass der richtige Inhaltstyp und die richtige Grenze festgelegt sind?
Übergabe von Daten an den Dienst in Axios
Problem: Sie möchten eine „_boundary“ an den Header von anhängen ein Axios-API-Aufruf, aber die Daten sind im Axios nicht zugänglich Service.
Lösung: Axios verarbeitet automatisch Inhaltstypen für bestimmte Anforderungstextformate, einschließlich FormData. Durch die Übergabe einer FormData-Instanz als Datenargument werden der entsprechende Inhaltstyp und die MIME-Grenze ohne manuelle Konfiguration festgelegt.
Detaillierte Erklärung:
Automatische Inhaltstypbehandlung :
Beim Senden einer FormData-Instanz setzt die Laufzeit den Content-Type automatisch auf „multipart/form-data“ und Enthält die richtigen MIME-Grenztoken. Dieses Verhalten stellt sicher, dass die Daten korrekt serialisiert und an den Server gesendet werden.
Beispiel:
Hier ist ein Beispiel für das Senden einer FormData-Instanz mit Axios:
<code class="javascript">const form = new FormData(); // Attach files and other fields to the formData instance form.append('file', fileInput.files[0]); form.append('foo', 'foo'); axios.post(url, form);</code>
Umgang mit benutzerdefinierten Inhaltstypen:
Sie müssen nur manuell vorgehen Legen Sie den Inhaltstyp fest, wenn Sie Zeichenfolgendaten in einem bestimmten Format senden möchten (z. B. Text/XML, Anwendung/JSON).
Beispiel:
<code class="javascript">const data = JSON.stringify({ foo: 'foo', bar: 'bar' }); axios.post(url, data, { headers: { 'content-type': 'application/json' }, });</code>
Vermeidung von Axios v0.27.1 und v1.0.0 :
Diese Axios-Versionen haben bekannte Probleme bei der Verarbeitung von FormData. Es wird empfohlen, Alternativen wie die Fetch-API, got (für Node.js) oder ky (für Browser) zu verwenden.
Node.js-Überlegungen:
Wann Wenn Axios im Node.js-Backend verwendet wird, werden keine Content-Type-Header von FormData-Instanzen abgeleitet. Um dieses Problem zu beheben, können Sie einen Request-Interceptor verwenden oder die Header manuell zusammenführen.
jQuery $.ajax() Methode:
Standardmäßig $.ajax() sendet Nutzlasten als „application/x-www-form-urlencoded“ und serialisiert JavaScript-Daten mit jQuery.param(). Damit der Browser den Inhaltstyp automatisch festlegen kann, verwenden Sie die folgenden Optionen:
<code class="javascript">$.ajax({ url, method: 'POST', data: body, contentType: false, // Let the browser figure out the content type processData: false, // Don't attempt to serialize data });</code>
Das obige ist der detaillierte Inhalt vonWie kann ich Daten an einen Dienst in Axios übergeben und sicherstellen, dass der richtige Inhaltstyp und die richtige Grenze festgelegt sind?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!