Heim > Web-Frontend > js-Tutorial > Hauptteil

Wie übergebe ich Daten mit FormData an Dienste in Axios?

DDD
Freigeben: 2024-11-04 04:48:02
Original
749 Leute haben es durchsucht

How to Pass Data to Services in Axios with FormData?

Übergabe von Daten an Dienste in Axios

Bei der Übertragung von Daten von einem Browser verarbeitet Axios automatisch bestimmte Anforderungstextformate und legt entsprechende Content-Type-Header fest. Wenn Sie Daten als Multipart-/Formulardaten senden und den Content-Type-Header manuell konfigurieren möchten, können Sie dies tun, indem Sie eine FormData-Instanz als Anforderungstext übergeben. Axios setzt den Header automatisch auf multipart/form-data; border=${form._boundary}.

<code class="javascript">import axios from 'axios';

const form = new FormData();
form.append('email', 'user@example.com');
form.append('password', 'secretpassword');

axios.post('user/login', form)
  .then((response) => {
    // Handle response
  })
  .catch((error) => {
    // Handle error
  });</code>
Nach dem Login kopieren

Verarbeitung von FormData in Node.js

Bei der Verwendung von Axios in Node.js werden Content-Type-Header nicht automatisch aus FormData abgeleitet Instanzen. Um dies zu umgehen, können Sie einen Anfrage-Interceptor verwenden.

<code class="javascript">axios.interceptors.request.use((config) => {
  if (config.data instanceof FormData) {
    Object.assign(config.headers, config.data.getHeaders());
  }
  return config;
}, null, { synchronous: true });</code>
Nach dem Login kopieren

Oder Sie können die Header manuell zusammenführen, wenn Sie eine Anfrage stellen.

<code class="javascript">axios.post('user/login', body, {
  headers: {
    'X-Any-Other-Headers': 'value',
    ...body.getHeaders(),
  },
});</code>
Nach dem Login kopieren

Fazit

Zusammenfassend lässt sich sagen, dass Sie durch die Verwendung von FormData-Instanzen und die entsprechende Konfiguration der Anforderungsoptionen Daten von loginService.js an Services/index.js übergeben und mehrteilige/Formulardatenanforderungen nahtlos verarbeiten können.

Das obige ist der detaillierte Inhalt vonWie übergebe ich Daten mit FormData an Dienste in Axios?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage