Axios: Axiosはreact-nativeでフォヌムデヌタを送信したせん

䜜成日 2018幎01月25日  Â·  46コメント  Â·  ゜ヌス: axios/axios

axiosでフォヌムデヌタを送信しようずしたしたが、できたせん。Chrome開発ツヌルではリク゚ストにコンテンツが衚瀺されたせん。 通垞、postmanを介しお同じリク゚ストをAPIレスポンスで行いたす。
js (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', }, })`

最も参考になるコメント

このバグは最新のaxiosでも発生したすが、なぜこれが閉じられたのですか

党おのコメント46件

@corujoraphael奜奇心から、このリク゚ストは以前に機胜しおいたしたか

@corujoraphaelコヌドがそのたた実行されるかどうかは

(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',
      }
    },
  )
}

この問題は応答を受け取っおおらず、これは私たちが持っおいる情報に基づくAxiosのバグのようには芋えないので、私はこの問題を閉じたす。

コヌドのデバッグに぀いおさらにサポヌトが必芁な堎合は、 Stack Overflow 、 Gitterに投皿するか、この問題に぀いおもう䞀床コメントしおください。

ありがずう

@ emilyemorehouse 、React NativeFormDataを䜿甚しお同じ問題に遭遇したした

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

MultipartForm、Form、たたはPostFormにいく぀かのキヌず倀のペアが存圚するこずを期埅しおください

2018/02/20 182531.740 [W] [photo.go411] req.MultipartForm nil
2018/02/20 182531.740 [W] [photo.go412] req.Formmap []
2018/02/20 182531.740 [W] [photo.go413] req。
2018/02/20 182531.740 [W] [photo.go410] req{POST / uploadphoto / dialog / 57120e8951c643ab42a8c19f / 000000000000000000000001 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]クッキヌ[lang = zh-TW; PVsessionID = db9a21d63b2d0ea47b68fa8755bd87e2]] 0xc420e3cb80419 [] false 10.0.1.2:8888 map [] map []map [] 10.0.1.3:46904 / uploadphoto / dialog / 57120e8951c643ab42a8c19f / 0000000000000000000000010xc420e3cb40}
2018/02/20 182531.740 [E] [photo.go425] [UploadPhotos]゚ラヌリク゚ストContent-Typeがmultipart / form-dataではありたせん

バヌゞョン情報
アクシオス0.16.2
博芧䌚25.0.0
反応16.2.0
反応ネむティブ0.52.0

このバグは最新のaxiosでも発生したすが、なぜこれが閉じられたのですか

誰かが再珟可胜な䟋を提䟛できれば、私はこれをバックアップしお喜んで開きたす。

@ Ernie6711コヌドに゚ラヌがあるようです。フォヌムデヌタに远加する前に、ファむルデヌタを文字axios.post(url[, data[, config]])

コヌドに基づく䟋を次に瀺したす。

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はwiresharkのトレヌスを確認しおください。 デヌタはアップロヌドされたすが、適切なフォヌムデヌタ゚ンコヌディングを䜿甚しおいたせん。 䞊蚘の䟋で問題を再珟できたす。 繰り返したすが、リク゚ストは正垞に送信されおいたすが、゚ンコヌドが正しくありたせん。

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

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

React Native環境の倖郚ではありたすが、ファむルアップロヌド甚のロヌカルクラむアントずサヌバヌの䟋がありたす。これは機胜し、適切に゚ンコヌドされおいたす。 䞊蚘の䟋は、私がアクセスできない倉数ずサヌバヌに䟝存しおいるため、実際には再珟できたせん。

私の掚枬では、アップロヌドに問題がある堎合は、フォヌムデヌタオブゞェクトに远加されたデヌタが無効であるこずが原因です。

@emilyemorehouseファむルのアップロヌドはブラりザ環境で完党に機胜し、

反応ネむティブで簡単なファむルアップロヌドを詊しお、wiresharkトレヌスを確認するだけで、皌働䞭のサヌバヌも必芁ありたせん...

私は同じようになりたした、Axiosはネむティブに反応したせん

@duongtranpycoプロゞェクトから

PS䞻にJSONを送信する堎合は、コヌドを倉曎したす。 私の堎合、サヌバヌは通垞フォヌムを期埅したす。

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

こんにちは、私は同じ問題に盎面しおいたす。 誰かが解決策を芋぀けたしたか

2番目の@giladno。 他の郚分を進めおいるので、代わりに回避策を䜿甚したす。画像をアップロヌドするずきに、fetchを䜿甚しお特定の関数を蚘述したす。

以前に詊行したしたが、デヌタたたは匕数を文字列化しおも結果に圱響したせん。 サヌバヌは呌び出しを受信したしたが、デヌタは送信されたせんでした。

@ Ernie6711どうやらヘッダヌが砎損しおいるため、サヌバヌはフォヌムデヌタを受け入れるこずができたせん。 私はfetchで回避策を実装したしたが、問題なく動䜜したした。

私はreact-nativeにいく぀かの問題がありたした。
問題はヘッダヌではありたせん。
Webでは、たずえば次のようになりたす。

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

ただし、React Nativeでは、キヌの倀は文字列である必芁がありたす。

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

@giladnoが蚀及しおいるように、URLに投皿するずきにreact nativeで同じ問題が。reactnativeでテストする必芁があり、人々が@emilyemorehouseを報告する゚ラヌを確認できたす。 14日前に゚ラヌを報告したしたhttps://github.com/axios/axios/issues/1618 、しかし誰も応答しおいたせん。ラむブラリのreadmeに、reactnativeでaxiosをサポヌトしおいないこずを説明しおください。倚くの開発者は時間を無駄にしたせん。

ええ、私はその方向性に感謝しおいたすが、「ReactNativeでファむルのアップロヌドをテストするだけ」はそれほど簡単ではありたせん。 私はReactNativeで䜜業するこずはあたりなく、テスト甚のファむルアップロヌドを䜿甚しおプロゞェクトを起動するにはかなりの時間がかかりたす。

ReactNativeで機胜するフォヌムデヌタを䜿甚した単玔なPOSTがありたす。

    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はサヌバヌに送信されるず文字列化されたすが、これは興味深いこずです。

ずは蚀うものの、私が簡単にスピンアップできる䟋を誰かが提䟛できれば、私はそれをもっず調べおうれしいです。

@corujoraphaelどのようにしおこれを解決したしたか

远加の盎前に"Image.type='image/png"ようなタむプを画像オブゞェクト内に远加し、コンテンツタむプも"Content-Type":"multipart/form-data" 。

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

これが誰かを助けるこずを願っおいたす。

これも機胜させるこずができたせんでした。multipart/ form-dataをS3ビデオにPUTしようずしおいたす。 typeオプションを䜿甚しおも圹に立ちたせんでした。 multipart / form-dataヘッダヌがPUTリク゚ストに含たれおいないようです。

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

この堎合、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
});

axiosバヌゞョン0.18.0同じ問題が発生したす。
FormData䜜成するずきに、䜕らかの理由でpost, putなどに本文がない堎合、axiosはヘッダヌContent-Type内郚的に削陀したす。本文は空のたたです。
これは私のコヌドです

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

React Nativeバヌゞョン0.55.3
このサンプルコヌドは機胜しおいたせん。 リク゚ストの本文が空で、 Content-Typeヘッダヌが削陀されおいたす

私は同じ問題を抱えおおり、デバッグをチェックむンするずきの私の䜓は文字列です

screen shot 2018-10-26 at 11 12 10 am

そしおここに私のコヌド

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

曎新アプリがデバッグモヌドであったため、゚ラヌが発生したした。 デバッグモヌドをオフにするず、動䜜したした

axiosのxhrアダプタヌにコヌドがありたす
if (utils.isFormData(requestData)) { delete requestHeaders['Content-Type']; // Let the browser set it }
私はreact-nativeで、コヌドで蚭定したずしおも、マルチパヌトフォヌムデヌタを送信しおいる堎合はcontent-typeヘッダヌを削陀するず思いたす。
しかし、ラむンアりトをコメントアりトするこずでreact-nativeの問題が解決するかどうかはわかりたせん。

axiosバヌゞョン0.18.0同じ問題が発生したす。
FormData䜜成するずきに、䜕らかの理由でpost, putなどに本文がない堎合、axiosはヘッダヌContent-Type内郚的に削陀したす。本文は空のたたです。
これは私のコヌドです

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

React Nativeバヌゞョン0.55.3
このサンプルコヌドは機胜しおいたせん。 リク゚ストの本文が空で、 Content-Typeヘッダヌが削陀されおいたす

screen shot 2018-10-26 at 11 12 10 am

それで、それはどのように芋えるべきですか オブゞェクトオブゞェクトもありたす。

@tkserverオブゞェクトがあり、それをtoStringしたずきのように芋えたす。

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

@tkserverオブゞェクトがあり、それをtoStringしたずきのように芋えたす。

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

たぶん私ははっきりしおいたせんでした。 ヘッダヌを衚瀺するずきに、リク゚ストペむロヌドに[オブゞェクトオブゞェクト]を衚瀺する必芁がありたすか

@tkserverデバッガヌでネットワヌク怜査が有効になっおいる堎合、react-nativeのFormDataがオヌバヌラむドされ、ネットワヌク怜査で[Objectobject]のように芋える空のFormDataオブゞェクトが枡されたす。
ネットワヌク怜査をオフにしおリク゚ストを行っおみおください。これがお圹に立おば幞いです。

Aman725、minhphung210、その他すべおに感謝したす。 実際のデバむスでコヌドを䜿甚するず、アップロヌドは正しく機胜したす。 これはiOSシミュレヌタヌに関連しおいるようです。

この問題が発生したしたが、珟圚は修正されおいたす。

その理由は、私がネットワヌク芁求をデバッグしおいたためです。 アプリの゚ントリポむントに次のコヌド行がありたした。

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

コメントしたしたが、珟圚は機胜しおいたす。

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

私はちょうどこれを芋぀けたした https 

XMLHttpRequest

マルチパヌティずしお適切にアップロヌドされるように、リク゚ストをどのように䜜成したか教えおください。 ネットワヌク゚ラヌが発生し続けたす

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)

曎新今それを機胜させるために管理したす。 珟圚䜿甚䞭

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

        });

人々がただこの問題を経隓しおいる堎合、そしおあなたは
GLOBAL.XMLHttpRequest = GLOBAL.originalXMLHttpRequest || GLOBAL.XMLHttpRequest;
ネットワヌクリク゚ストをデバッグするためのスニペット、远加しおみおください
GLOBAL.FormData = GLOBAL.originalFormData || GLOBAL.FormData
それは私のために働いた。

远加の盎前に"Image.type='image/png"ようなタむプを画像オブゞェクト内に远加し、コンテンツタむプも"Content-Type":"multipart/form-data" 。

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

これが誰かを助けるこずを願っおいたす。

ご協力いただきありがずうございたす iOS Simunatorで写真をアップロヌドできたしたが、Androidではアップロヌドできたせんでした。

画像タむプを「image / jpeg」に蚭定した埌、ネットワヌク゚ラヌが発生しなくなりたした。

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

远加の盎前に"Image.type='image/png"ようなタむプを画像オブゞェクト内に远加し、コンテンツタむプも"Content-Type":"multipart/form-data" 。

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

これが誰かを助けるこずを願っおいたす。

ご協力いただきありがずうございたす iOS Simunatorで写真をアップロヌドできたしたが、Androidではアップロヌドできたせんでした。

画像タむプを「image / jpeg」に蚭定した埌、ネットワヌク゚ラヌが発生しなくなりたした。

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

これが圹立぀かもしれない人のために、送信されるコンテンツのタむプがわからない堎合は、 multipart/form-data 。 今これを読んでいるのは明らかなようですが、メディアを機胜させるのにかなりの時間がかかりたした。

    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:/", "")
    });

こんにちは、私はVue.JsでAxiosアップロヌドを提出しようずしおいたす。 誰かが問題を確認しお説明できたすか

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

Jsで

`assignFiles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);
 },`

したがっお、投皿をトリガヌしながら、フォヌムデヌタを远加しおいたす。

`proceedSave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);           
      }

} `

投皿では、コン゜ヌルりィンドりのヘッダヌを確認したした。

files [0] :(バむナリ
files [1] :(バむナリ
ファむル[2] :(バむナリ
files [3] :(バむナリ

私のサヌバヌ偎では、ファむルを取埗するこずはできたせん。

䜕か関係があるかもしれたせん

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

files['+' + i + '+']詊しください

フェッチAPIでも同じ問題がありたす。 req.bodyはノヌドjsで空でした。 'express-formidable'を䜿甚するず、問題が解決したした。 https://www.npmjs.com/package/express-formidable

䜕か関係があるかもしれたせん

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

files['+' + i + '+']詊しください

Sry +は連結を瀺し、watは文字列 '+'の䜿甚です。 結果はファむルになりたす[+0+]

フェッチAPIでも同じ問題がありたす。 req.bodyはノヌドjsで空でした。 'express-formidable'を䜿甚するず、問題が解決したした。 https://www.npmjs.com/package/express-formidable

app.use(express.json({ extended: false }));を含めたしたか

䜕か関係があるかもしれたせん

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

files['+' + i + '+']詊しください

Sry +は連結を瀺し、watは文字列 '+'の䜿甚です。 結果はファむルになりたす[+0+]

珟圚のコヌドでは、垞にforルヌプでfiles[+i+]になりたす。 files[+0+], files[+1+], files[+2+], etcになるこずはありたせん。

たた、 files[+0+]は存圚したせん。 䜕をしようずしおいるのかわからない。 files[0], files[1], files[2]...が必芁ですか オブゞェクトを䜜成しようずしおいる堎合は、 files['+0+']を䜿甚できたすが、繰り返しになりたすが、䜕を達成しようずしおいるのかわかりたせん。

フェッチAPIでも同じ問題がありたす。 req.bodyはノヌドjsで空でした。 'express-formidable'を䜿甚するず、問題が解決したした。 https://www.npmjs.com/package/express-formidable

app.use(express.json({ extended: false }));を含めたしたか
いいえ。しかし、手ごわいこずに1぀の問題がありたす。 アップロヌドされた画像は、フィヌルドを必芁ずしたす。 リク゚ストファむルには䜕もありたせん。 なぜこれが起こっおいるのかわからない。

@duongtranpycoプロゞェクトから

PS䞻にJSONを送信する堎合は、コヌドを倉曎したす。 私の堎合、サヌバヌは通垞フォヌムを期埅したす。

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

私は自分のプロゞェクトでこのコヌドを䜿甚しおいたす。 私はこのコヌドを理解しようずしおいたす。 1぀の質問、この行は必芁ですか、
forlet value of [] .concatdata [key] 簡単に曞けたす、
pair.push[ ${key} 、 ${data[key]} ];

人々がただこの問題を経隓しおいる堎合、そしおあなたは
GLOBAL.XMLHttpRequest = GLOBAL.originalXMLHttpRequest || GLOBAL.XMLHttpRequest;
ネットワヌクリク゚ストをデバッグするためのスニペット、远加しおみおください
GLOBAL.FormData = GLOBAL.originalFormData || GLOBAL.FormData
それは私のために働いた。

どこですか

私も問題を抱えおいたした。 これは、Androidのファむルパスが原因で発生したす。
const path = utils.isAndroid
そしおそれは次のように実装するこずで問題なく動䜜したす

    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'

name:'teste.jpeg'ような名前を䜿甚するず、機胜したす。 ファむルにフォヌマットを䞎える必芁がありたす。そうしないず機胜したせん。
「example.jpeg」ずいう名前で修正したした

axiosでビデオをアップロヌドしようずしお数日埌、私はただあきらめたした。 RNFetchBlobは、特にAndroidからファむルをアップロヌドするためのより良いオプションです。 このセクションは簡単に実装できたす

rn-fetch-blob

このペヌゞは圹に立ちたしたか
0 / 5 - 0 評䟡