Axios: Axios sendet keine Formulardaten in Reactive-native

@corujoraphael Aus Neugier, hat diese Anfrage früher funktioniert?

@corujoraphael Ich bin mir nicht sicher, ob Ihr Code so ausgeführt wird, wie er ist. Die Konfiguration, in der Sie Ihre Header angeben, sollte ein Objekt sein, aber es fehlt eine geschweifte Klammer:

(newData) => {
  const data = new FormData();
  data.append('name', 'raphael');
  data.append('file', {
    uri: newData.image.path,
    type: 'image/jpeg',
    name: 'teste'
  });

  return axios.post(
    `${constants.development.URL_API}/file`,
    data, 
    { 
      headers: {
        'Content-Type': 'multipart/form-data',
      }
    },
  )
}

Da dieses Problem keine Antwort erhalten hat und dies nach den uns vorliegenden Informationen nicht wie ein Axios-Fehler aussieht, schließe ich dieses Problem.

Wenn Sie weitere Hilfe beim Debuggen Ihres Codes benötigen, posten Sie dies bitte auf Stack Overflow , Gitter oder kommentieren Sie dieses Problem erneut.

Vielen Dank!

@emilyemorehouse , ich habe das gleiche Problem mit React Native FormData festgestellt

let s = JSON.stringify({ uri: localUri, name: filename, type: type });
let formData = new FormData();
formData.append('ph0t0', s);

axios.post("http://10.0.1.2:8888/uploadphoto", {
        method: "POST",
        headers: {
                'Content-Type': 'multipart/form-data; charset=utf-8; boundary="another cool boundary";'
        },
        body: formData,
}).then((resp) => {
        console.log(resp);
}).catch(err => {
        console.log(err);
});

Erwarten Sie, dass einige Schlüssel:Wert- Paare in MultipartForm, Form oder PostForm vorhanden sind

20.02.2018 18:25:31.740 [W] [photo.go:411] req.MultipartForm: nil
20.02.2018 18:25:31.740 [W] [photo.go:412] Anf.Form: Karte[]
20.02.2018 18:25:31.740 [W] [photo.go:413] Anf.
20.02.2018 18:25:31.740 [W] [photo.go:410] req: &{POST /uploadphoto/dialog/57120e8951c643ab42a8c19f/00000000000000000000001 HTTP/1.1 1 1 map[Content-Type:[application/json;charset =utf-8] User-Agent:[okhttp/3.6.0] Accept:[application/json, text/plain, / ] Content-Length:[419] Connection:[Keep-Alive] Accept-Encoding:[gzip] Cookie:[lang=zh-TW; PVsessionID=db9a21d63b2d0ea47b68fa8755bd87e2]] 0xc420e3cb80419 [] falsch 10.0.1.2:8888 Karte[] Karte[]map[] 10.0.1.3:46904 /uploadphoto/dialog/57120e8951c643ab42a8c19f/0000000000000000000000010xc420e3cb40}
20.02.2018 18:25:31.740 [E] [photo.go:425] [UploadPhotos] Fehler: Request Content-Type ist nicht mehrteilig/form-data

Versions Information
Achsen: 0.16.2
Ausstellung: 25.0.0
reagieren: 16.2.0
reaktionsfähig: 0.52.0

Dieser Fehler tritt immer noch mit den neuesten Axios auf, warum wurde dieser geschlossen?

Wenn jemand ein reproduzierbares Beispiel liefern kann, öffne ich dieses gerne wieder.

@ Ernie6711 es sieht so aus, als hätten Sie einen Fehler in Ihrem Code - ich denke nicht, dass Sie die Dateidaten stringifizieren sollten, bevor Sie sie an Ihre Formulardaten anhängen. Außerdem sind die Argumente für axios.post axios.post(url[, data[, config]])

Hier ist ein Beispiel basierend auf Ihrem Code:

const file ={ uri: localUri, name: filename, type: type};
const formData = new FormData();
formData.append('file', s);

const config = {
        headers: {
                'Content-Type': 'multipart/form-data; charset=utf-8; boundary="another cool boundary";'
        }
};

axios.post("http://10.0.1.2:8888/uploadphoto", formData, config).then((resp) => {
        console.log(resp);
}).catch(err => {
        console.log(err);
});

@emilyemorehouse Bitte überprüfen Sie die Wireshark-Spuren. Die Daten werden hochgeladen, verwenden jedoch KEINE korrekte Form-Daten-Codierung. Das obige Beispiel kann das Problem reproduzieren. Nochmals - die Anfrage wurde erfolgreich gesendet, ist aber schlecht codiert.

POST /myserver HTTP/1.1
Content-Type: multipart/form-data

_parts=USERX%2Cusername&_parts=FILE1%2C%5Bobject%20Object%5D

Ich habe ein lokales Client- und Serverbeispiel für Datei-Uploads, wenn auch außerhalb der React Native-Umgebung, das funktioniert und richtig codiert ist. Das obige Beispiel ist nicht wirklich reproduzierbar, da es auf Variablen und einem Server angewiesen ist, auf den ich keinen Zugriff habe.

Ich vermute, wenn beim Hochladen etwas nicht stimmt, liegt dies daran, dass die an das Formulardatenobjekt angehängten Daten ungültig sind.

@emilyemorehouse Datei-Uploads funktionieren in einer Browserumgebung perfekt, sie wenn sie nativ reagieren. Wie Sie selbst erwähnt haben - Ihre Tests waren außerhalb der nativen Reaktionsumgebung, ich würde dort anfangen :)

Versuchen Sie es mit einem einfachen Dateiupload in React Native und überprüfen Sie einfach die Wireshark-Traces, Sie brauchen nicht einmal einen funktionierenden Server ...

Ich habe das gleiche, Axios reagiert nicht auf nativ

@duongtranpyco Ich habe Axios aus meinem Projekt entfernt, stattdessen habe ich meine eigene einfache Klasse geschrieben, viel Spaß!

PS Wenn Sie hauptsächlich JSON senden, ändern Sie den Code. In meinem Fall erwartet der Server normalerweise ein Formular.

const request = async ({url, method = 'GET', params, body, responseType = 'json', headers = {}})=>{
    const escape = (data, encode = encodeURIComponent)=>Object.keys(data||{}).reduce((pairs, key)=>{
        for (let value of [].concat(data[key]))
            pairs.push([`${key}`, `${value}`]);
        return pairs;
    }, []).map(pair=>pair.map(encode).join('=')).join('&');

    if (Object.keys(params||{}).length)
        url += '?'+escape(params);
    if (method=='POST' && typeof body=='object')
    {
        if (body instanceof FormData)
            headers['Content-Type'] = 'multipart/form-data';
        else
        {
            body = escape(body);
            headers['Content-Type'] = 'application/x-www-form-urlencoded';
        }
    }
    let {statusCode, request: req} = await new Promise((resolve, reject)=>{
        let xhr = new XMLHttpRequest();
        xhr.open(method, url, true);
        xhr.withCredentials = true;
        xhr.responseType = {json: 'text'}[responseType]||responseType;
        xhr.onload = ()=>resolve({statusCode: xhr.status, request: xhr});
        xhr.onerror = ()=>reject(new TypeError('Network request failed'));
        xhr.ontimeout = ()=>reject(new TypeError('Network request timed out'));
        for (let key in headers)
            xhr.setRequestHeader(key, headers[key]);
        xhr.send(body||null);
    });
    if (statusCode<200 || statusCode>=400)
        throw new Error(`network request failed with ${statusCode}: ${url}`);
    switch(responseType)
    {
        case 'json':
            return JSON.parse(req.responseText);
        case 'text':
            return req.responseText;
        case 'request':
            return req;
    }
    return req.response;
};

request.get = (url, opt = {})=>request({...opt, url, body: null});
request.post = (url, ...args)=>request({...args[1]||{}, url, method: 'POST', body: args[0]});

Hallo, ich stehe vor dem gleichen Problem. Hat jemand eine Lösung gefunden?

Zweite @giladno. Da ich an anderen Stellen vorgehe, verwende ich stattdessen einen Workaround: Schreiben Sie eine bestimmte Funktion mit fetch() beim Hochladen von Bildern.

Vorher versucht und weder das Stringing der Daten noch die Argumente beeinflussen das Ergebnis. Der Server hat den Anruf empfangen, aber keine Daten gesendet.

@ Ernie6711 anscheinend sind die Header beschädigt und deshalb kann der Server die Formulardaten nicht akzeptieren. Ich habe den Workaround mit fetch() implementiert und es hat ohne Probleme funktioniert.

Ich hatte das einige Problem in Reactive-Native.
Das Problem sind nicht die Header.
Im Web können wir zum Beispiel haben:

let formData = new FormData()
formData.append('key', true // bool value)

aber in react native muss der Wert für key string sein.

formData.append('key', 'true')

Ich habe das gleiche Problem mit React Native, wenn ich an eine URL @giladno erwähnt, Sie sollten in https://github.com/axios/axios/issues/1618 , aber niemand hat geantwortet, bitte beschreibe in der Readme deiner Bibliothek, dass du keine Unterstützung für Axios auf React native hast, damit viele Entwickler verschwenden keine Zeit..!

Ich schätze die Richtung, aber "einfach einen Datei-Upload in React Native testen" ist nicht so einfach. Ich arbeite nicht oft in React Native und es würde ziemlich lange dauern, ein Projekt mit Datei-Uploads zum Testen zu starten.

Ich habe einen einfachen POST mit Formulardaten, der in React Native funktioniert:

    const formData = new FormData();
    formData.append("data", true);

    const config = {
      headers: {
        "Content-Type": "multipart/form-data; charset=utf-8;"
      }
    };

    axios.post(URL, formData, config).then(
      response => {
        console.log({ response });
      },
      error => {
        console.log({ error });
      }
    );

true wird beim Senden an den Server stringifiziert, was interessant ist.

Das heißt, wenn jemand ein Beispiel liefern kann, das ich leicht umsetzen kann, freue ich mich, es näher zu untersuchen.

@corujoraphael wie hast du das gelöst?

Ich habe dem Bildobjekt einen Typ wie "Image.type='image/png" kurz vor dem Anhängen hinzugefügt und auch den Inhaltstyp in "Content-Type":"multipart/form-data" geändert:

        image.type='image/png'
        formData.append("resource", image);
        return axios
          .post('yourBAckendUrl', formData, {
            headers: {
              Authorization: "yourTokenHere",
              "Content-Type": "multipart/form-data"
            }
          })

Hoffe das hilft jemandem.

Ich konnte dies auch nicht zum Laufen bringen, ich versuche, mehrteilige / form-Daten auf S3 (Video) zu übertragen. Die Verwendung der Typoption hat nicht geholfen. Der multipart/form-data-Header scheint nicht in der PUT-Anfrage zu sein:

      const data = new FormData();
      data.append('video', {
          uri: 'file:///<path_to_video_on_iphone.mov',
          type: 'video/quicktime',
          name: 'video.mov',
      });
      response = yield call(() => {
        return api.put(url, data, {
          headers: {
              'Content-Type': 'multipart/form-data',
          },
          transformRequest: [
            (data, headers) => {
                delete headers.common.Authorization;
                return data;
            }
          ]
        });
      });

Verwenden Sie in diesem Fall fetch :D

var data = new FormData();  
data.append('my_photo', {  
  uri: filePath, // your file path string
  name: 'my_photo.jpg',
  type: 'image/jpg'
}

fetch(path, {  
  headers: {
    'Accept': 'application/json',
    'Content-Type': 'multipart/form-data'
  },
  method: 'POST',
  body: data
});

in der Axios-Version 0.18.0 mit dem gleichen Problem.
axios entfernt intern den Header Content-Type wenn es aus irgendeinem Grund keinen Body auf post, put usw. gibt, wenn FormData wird, bleibt der Body leer.
das ist mein Code:

const sendFormData = images => {
   // images is an array of base64 images (strings)
    const formData = new FormData();
    images.forEach((img, i) => {
        formData.append('file', img);
        formData.append('name', `${type}-${i + 1}`);
    });

    config.headers = {
        .'Content-Type': 'multipart/form-data'
     };

     return axios.post(`http://someurl.com/api/upload-images`, formData, config)
            .then(response => {
               // handle success
            })
            .catch(err => {
                // handle err
     });
}

Reagieren Native Version 0.55.3
dieser Beispielcode funktioniert nicht. Anfragetext ist leer und der Content-Type Header wird entfernt

Ich habe die gleichen Probleme und mein Körper, wenn ich Debug einchecke, ist String

und hier mein code

        const formData = new FormData();
        formData.append('photo', {
          uri: response.uri.replace('file://', ''),
          mineType: 'image/jpeg',
          fileType: 'image/jpg',
          type: 'image/jpg',
          name: 'test.jpg'
        });

        console.log('form data', formData);

         Axios({
           method: 'post',
           url: 'https://dev-host.luxstay.net/api/rooms/10740/photos',
           data: formData,
           headers: {
             Authorization: token,
             'Content-Type': 'multipart/form-data'
           }
         });

Update : Ein Fehler ist aufgetreten, weil sich die App im Debug-Modus befand. Wenn ich den Debug-Modus ausschalte, hat es funktioniert

axios hat einen Code in seinem xhr-Adapter
if (utils.isFormData(requestData)) { delete requestHeaders['Content-Type']; // Let the browser set it }
Ich denke, in React-Native löscht es den Content-Type-Header, wenn Sie mehrteilige Formulardaten senden, auch wenn Sie es im Code festlegen.
Aber ich bin mir nicht sicher, ob das Auskommentieren der Zeile Ihr Problem in Reaktiv-nativ lösen würde.

in der Axios-Version 0.18.0 mit dem gleichen Problem.
axios entfernt intern der Header Content-Type , wenn es keinen Körper auf dem ist post, put usw. aus irgendeinem Grund bei der Erstellung von FormData der Körper leer bleibt ..
das ist mein Code:

const sendFormData = images => {
   // images is an array of base64 images (strings)
    const formData = new FormData();
    images.forEach((img, i) => {
        formData.append('file', img);
        formData.append('name', `${type}-${i + 1}`);
    });

    config.headers = {
        .'Content-Type': 'multipart/form-data'
     };

     return axios.post(`http://someurl.com/api/upload-images`, formData, config)
            .then(response => {
               // handle success
            })
            .catch(err => {
                // handle err
     });
}

Reagieren Native Version 0.55.3
dieser Beispielcode funktioniert nicht. Anfragetext ist leer und der Content-Type Header wird entfernt

Wie sollte es also aussehen? Ich habe auch Objektobjekt.

@tkserver sieht es so aus, wenn Sie ein Objekt haben und dann toString() es.

const a = {
  name: 'dasdasd'
}
console.log(a.toString());

@tkserver sieht es so aus, wenn Sie ein Objekt haben und dann toString() es.

const a = {
  name: 'dasdasd'
}
console.log(a.toString());

Vielleicht war ich nicht klar. Sollte die Request Payload beim Anzeigen der Header [object Object] anzeigen?

@tkserver Wenn Ihr Debugger die Netzwerkprüfung aktiviert hat, überschreibt er die FormData des React-Native und führt zur Übergabe eines leeren FormData-Objekts, das in der Netzwerkprüfung wie [Objektobjekt] aussieht.
Versuchen Sie, eine Anfrage zu stellen, indem Sie die Netzwerkprüfung deaktivieren. Hoffentlich hilft dies.

Danke Aman725, minhphung210 und alle. Wenn ich den Code auf einem echten Gerät verwende, funktioniert der Upload einwandfrei. Es scheint, dass dies mit dem iOS-Simulator zusammenhängt.

Ich hatte dieses Problem, aber es ist jetzt behoben.

Der Grund dafür war, dass ich Netzwerkanfragen debuggte. Ich hatte diese Codezeile im Einstiegspunkt meiner App:

GLOBAL.XMLHttpRequest = GLOBAL.originalXMLHttpRequest || GLOBAL.XMLHttpRequest;

Ich habe es kommentiert und es funktioniert jetzt.

// IMPORTANT: this will cause FormData requests to fail.
// GLOBAL.XMLHttpRequest = GLOBAL.originalXMLHttpRequest || GLOBAL.XMLHttpRequest;

Ich habe das gerade gefunden: https://stackoverflow.com/a/47630754/387912 , hilft es?

XMLHttpRequest

Können Sie mir sagen, wie Sie die Anfrage erstellt haben, damit sie als Mehrparteien ordnungsgemäß hochgeladen wird? Ich bekomme immer einen Netzwerkfehler:

Error: Network Error
    at createError (blob:http://localhost:8081/0754d453-361d-48d1-aaa5-9ff1ad808293:168963:17)
    at XMLHttpRequest.handleError (blob:http://localhost:8081/0754d453-361d-48d1-aaa5-9ff1ad808293:168871:16)
    at XMLHttpRequest.dispatchEvent (blob:http://localhost:8081/0754d453-361d-48d1-aaa5-9ff1ad808293:28708:27)
    at XMLHttpRequest.setReadyState (blob:http://localhost:8081/0754d453-361d-48d1-aaa5-9ff1ad808293:28461:20)
    at XMLHttpRequest.__didCompleteResponse (blob:http://localhost:8081/0754d453-361d-48d1-aaa5-9ff1ad808293:28288:16)
    at blob:http://localhost:8081/0754d453-361d-48d1-aaa5-9ff1ad808293:28398:47
    at RCTDeviceEventEmitter.emit (blob:http://localhost:8081/0754d453-361d-48d1-aaa5-9ff1ad808293:3291:37)
    at MessageQueue.__callFunction (blob:http://localhost:8081/0754d453-361d-48d1-aaa5-9ff1ad808293:2588:44)
    at blob:http://localhost:8081/0754d453-361d-48d1-aaa5-9ff1ad808293:2345:17
    at MessageQueue.__guard (blob:http://localhost:8081/0754d453-361d-48d1-aaa5-9ff1ad808293:2542:13)

UPDATE: Schaffen Sie es jetzt zum Laufen. Derzeit verwendet:

formData.append('picture', {
          uri: data.uri,
          name: fname,
          type: 'image/' + ext

        });

Wenn dieses Problem immer noch auftritt und Sie haben
GLOBAL.XMLHttpRequest = GLOBAL.originalXMLHttpRequest || GLOBAL.XMLHttpRequest;
Snippet zum Debuggen von Netzwerkanfragen, versuchen Sie es mit dem Hinzufügen
GLOBAL.FormData = GLOBAL.originalFormData || GLOBAL.FormData
bei mir hat es funktioniert.

Ich habe dem Bildobjekt einen Typ wie "Image.type='image/png" kurz vor dem Anhängen hinzugefügt und auch den Inhaltstyp in "Content-Type":"multipart/form-data" geändert:

        image.type='image/png'
        formData.append("resource", image);
        return axios
          .post('yourBAckendUrl', formData, {
            headers: {
              Authorization: "yourTokenHere",
              "Content-Type": "multipart/form-data"
            }
          })

Hoffe das hilft jemandem.

Danke für Ihre Hilfe! Ich konnte mein Bild mit dem iOS Simunator hochladen, aber nicht mit dem Android.

Nachdem ich den Bildtyp auf 'image/jpeg' gesetzt habe, habe ich keinen Netzwerkfehler mehr.

const formData = new FormData();
formData.append('file', {
  uri: pictureUri,
  type: 'image/jpeg',
  name: 'profile-picture'
})

Ich habe dem Bildobjekt einen Typ wie "Image.type='image/png" kurz vor dem Anhängen hinzugefügt und auch den Inhaltstyp in "Content-Type":"multipart/form-data" geändert:

        image.type='image/png'
        formData.append("resource", image);
        return axios
          .post('yourBAckendUrl', formData, {
            headers: {
              Authorization: "yourTokenHere",
              "Content-Type": "multipart/form-data"
            }
          })

Hoffe das hilft jemandem.

Danke für Ihre Hilfe! Ich konnte mein Bild mit dem iOS Simunator hochladen, aber nicht mit dem Android.

Nachdem ich den Bildtyp auf 'image/jpeg' gesetzt habe, habe ich keinen Netzwerkfehler mehr.

const formData = new FormData();
formData.append('file', {
  uri: pictureUri,
  type: 'image/jpeg',
  name: 'profile-picture'
})

Für alle, denen dies hilfreich sein könnte, verwenden Sie multipart/form-data , wenn Sie die Art des gesendeten Inhalts nicht kennen. Es klingt jetzt selbstverständlich, dies zu lesen, aber ich brauchte eine gute Stunde, um alle Medien zum Laufen zu bringen.

    data.append("image", {
      name: "some_name", // also, won't work without this. A name is required
      height: image.height,
      width: image.width,
      type: "multipart/form-data", // <-- this part here
      uri:
        Platform.OS === "android" ? image.uri : image.uri.replace("file:/", "")
    });

Hallo, ich versuche, den Axios-Upload in Vue.Js zu archivieren. Kann jemand das Problem überprüfen und erklären?

In HTML
<input type="file" id="file" ref="file" multiple @change="assignFiles"/>

In Js

` Dateien zuweisen (e){

      let uploadedFiles = this.$refs.file.files;
      for( var i = 0; i < uploadedFiles.length; i++ ) { 
        this.form.AttachmentDocs.push(uploadedFiles[i]);           
      }
      console.log(this.form.AttachmentDocs);
 },`

Also, während Sie den Beitrag auslösen, fügen Sie Formulardaten an.

`weiterSpeichern(e) {

      e.preventDefault();
      this.$v.$touch();
      if(this.$v.$invalid) {
        return;
      }
    this.showLoading(this.loaderId,true);
      this.postDatas.append('form',JSON.stringify(this.form));
      for( var i = 0; i < this.form.AttachmentDocs.length; i++ ){ 
        let attachment = this.form.AttachmentDocs[i];
        this.postDatas.append('files['+i+']',attachment,attachment.name);           
      }

}`

In dem Beitrag habe ich den Header des Konsolenfensters überprüft, dort wird er angezeigt

dateien[0]: (binär)
Dateien[1]: (binär)
Dateien[2]: (binär)
Dateien[3]: (binär)

Auf meiner Serverseite kann ich die Dateien nicht abrufen.

Könnte etwas damit zu tun haben

this.postDatas.append('files['+i+']',attachment,attachment.name);  

Versuchen Sie es mit files['+' + i + '+']

Ich habe das gleiche Problem mit der Abruf-API. req.body war im Knoten js leer. Die Verwendung von 'express-formidable' löste das Problem. https://www.npmjs.com/package/express-formidable

Könnte etwas damit zu tun haben

this.postDatas.append('files['+i+']',attachment,attachment.name);  

Versuchen Sie es mit files['+' + i + '+']

Sry + gibt die Verkettung an, wat ist die Verwendung von String '+' . Das Ergebnis sind Dateien[+0+]

Ich habe das gleiche Problem mit der Abruf-API. req.body war im Knoten js leer. Die Verwendung von 'express-formidable' löste das Problem. https://www.npmjs.com/package/express-formidable

Haben Sie app.use(express.json({ extended: false })); ?

Könnte etwas damit zu tun haben

this.postDatas.append('files['+i+']',attachment,attachment.name);  

Versuchen Sie es mit files['+' + i + '+']

Sry + gibt die Verkettung an, wat ist die Verwendung von String '+' . Das Ergebnis sind Dateien[+0+]

Ihr aktueller Code führt in Ihrer for-Schleife immer zu files[+i+] . Es wird niemals files[+0+], files[+1+], files[+2+], etc .

Außerdem wird files[+0+] niemals existieren. Nicht sicher, was Sie versuchen zu tun. Sie brauchen files[0], files[1], files[2]... ? Wenn Sie versuchen, ein Objekt zu erstellen, können Sie files['+0+'] , aber auch hier bin ich mir nicht sicher, was Sie erreichen möchten.

Ich habe das gleiche Problem mit der Abruf-API. req.body war im Knoten js leer. Die Verwendung von 'express-formidable' löste das Problem. https://www.npmjs.com/package/express-formidable

Haben Sie app.use(express.json({ extended: false })); ?
Nein. Allerdings habe ich ein Problem. Das hochgeladene Bild benötigt Felder. Nichts in Anforderungsdateien. Nicht sicher, warum dies geschieht.

@duongtranpyco Ich habe Axios aus meinem Projekt entfernt, stattdessen habe ich meine eigene einfache Klasse geschrieben, viel Spaß!

PS Wenn Sie hauptsächlich JSON senden, ändern Sie den Code. In meinem Fall erwartet der Server normalerweise ein Formular.

const request = async ({url, method = 'GET', params, body, responseType = 'json', headers = {}})=>{
    const escape = (data, encode = encodeURIComponent)=>Object.keys(data||{}).reduce((pairs, key)=>{
        for (let value of [].concat(data[key]))
            pairs.push([`${key}`, `${value}`]);
        return pairs;
    }, []).map(pair=>pair.map(encode).join('=')).join('&');

    if (Object.keys(params||{}).length)
        url += '?'+escape(params);
    if (method=='POST' && typeof body=='object')
    {
        if (body instanceof FormData)
            headers['Content-Type'] = 'multipart/form-data';
        else
        {
            body = escape(body);
            headers['Content-Type'] = 'application/x-www-form-urlencoded';
        }
    }
    let {statusCode, request: req} = await new Promise((resolve, reject)=>{
        let xhr = new XMLHttpRequest();
        xhr.open(method, url, true);
        xhr.withCredentials = true;
        xhr.responseType = {json: 'text'}[responseType]||responseType;
        xhr.onload = ()=>resolve({statusCode: xhr.status, request: xhr});
        xhr.onerror = ()=>reject(new TypeError('Network request failed'));
        xhr.ontimeout = ()=>reject(new TypeError('Network request timed out'));
        for (let key in headers)
            xhr.setRequestHeader(key, headers[key]);
        xhr.send(body||null);
    });
    if (statusCode<200 || statusCode>=400)
        throw new Error(`network request failed with ${statusCode}: ${url}`);
    switch(responseType)
    {
        case 'json':
            return JSON.parse(req.responseText);
        case 'text':
            return req.responseText;
        case 'request':
            return req;
    }
    return req.response;
};

request.get = (url, opt = {})=>request({...opt, url, body: null});
request.post = (url, ...args)=>request({...args[1]||{}, url, method: 'POST', body: args[0]});

Ich verwende diesen Code in meinem Projekt. Ich versuche diesen Code zu verstehen. Eine Frage, ist diese Zeile notwendig,
for (let value of [].concat(data[key]))? Es kann einfach geschrieben werden,
pairs.push([ ${key} , ${data[key]} ]);

Wenn dieses Problem immer noch auftritt und Sie haben
GLOBAL.XMLHttpRequest = GLOBAL.originalXMLHttpRequest || GLOBAL.XMLHttpRequest;
Snippet zum Debuggen von Netzwerkanfragen, versuchen Sie es mit dem Hinzufügen
GLOBAL.FormData = GLOBAL.originalFormData || GLOBAL.FormData
bei mir hat es funktioniert.

Wo ist es?

Ich hatte das Problem auch. Es wird durch den Dateipfad in Android verursacht.
const path = utils.isAndroid() ?
Und es funktioniert gut mit der Implementierung wie folgt

    const formData = new FormData();
    const path = utils.isAndroid() ? `file://${filePath}` : filePath;
    formData.append('Voice', {
      uri: path,
      name: 'test',
      type: 'audio/wav',
    });

    formData.append('Content-Type', 'audio/wav');
     const headers =  {
        'Content-Type': 'multipart/form-data',
      };
    return this._sendRequest(url, 'POST', formData, headers);

 data.append('file', {
    uri: newData.image.path,
    type: 'image/jpeg',
    name: 'teste'

Verwenden Sie einen Namen wie: name:'teste.jpeg' und es wird funktionieren. Sie müssen der Datei ein Format geben, sonst funktioniert es nicht.
Ich habe es behoben, indem ich den Namen habe:'example.jpeg'

Nachdem ich mehrere Tage lang versucht habe, Videos mit Axios hochzuladen, gebe ich einfach auf. RNFetchBlob ist eine bessere Option zum Hochladen von Dateien von insbesondere Android. Dieser Abschnitt ist einfach zu implementieren

rn-fetch-blob