Как загрузить изображение на сервере с помощью ReactNative

Я устанавливаю заголовки и тело, используя fetch with Post для загрузки изображения на сервере. Я получаю код ответа 200, но он не загружает изображение, но остальная часть данных загружается.

Вот код тела:

export default function setRequestBody(imagePath){ let boundry = "----WebKitFormBoundaryIOASRrUAgzuadr8l"; let body = new FormData(); body.append("--"+boundry+"\r\n"); body.append("Content-Disposition: form-data; name=imageCaption\r\n\r\n"); body.append("Caption"+"\r\n"); body.append("--"+boundry+"\r\n"); body.append("Content-Disposition: form-data; name=imageFormKey; filename =iimageName.pngg \r\n"); body.append("Content-Type: image/png \r\n\r\n"); body.append({uri : imagePath}); // appened image Data Here body.append("\r\n"); body.append("--"+boundry+"--\r\n"); return body } 

Пожалуйста, помогите. Какую ошибку я делаю. 🙁

Проблема заключается в body.append({uri : imagePath}); Потому что реакция родного АО не поддерживает File и Blob, поэтому вам нужно использовать библиотеки.

Response-native-fetch-blob имеет очень хорошую поддержку для этого, например, из README.md

  RNFetchBlob.fetch('POST', 'http://www.example.com/upload-form', { Authorization : "Bearer access-token", otherHeader : "foo", 'Content-Type' : 'multipart/form-data', }, [ // element with property `filename` will be transformed into `file` in form data { name : 'avatar', filename : 'avatar.png', data: binaryDataInBase64}, // custom content type { name : 'avatar-png', filename : 'avatar-png.png', type:'image/png', data: binaryDataInBase64}, // part file from storage { name : 'avatar-foo', filename : 'avatar-foo.png', type:'image/foo', data: RNFetchBlob.wrap(path_to_a_file)}, // elements without property `filename` will be sent as plain text { name : 'name', data : 'user'}, { name : 'info', data : JSON.stringify({ mail : 'example@example.com', tel : '12345678' })}, ]).then((resp) => { // ... }).catch((err) => { // ... }) 

Я нашел решение:

 let body = new FormData(); body.append('photo', {uri: imagePath,name: 'photo.png',filename :'imageName.png',type: 'image/png'}); body.append('Content-Type', 'image/png'); fetch(Url,{ method: 'POST',headers:{ "Content-Type": "multipart/form-data", "otherHeader": "foo", } , body :body} ) .then((res) => checkStatus(res)) .then((res) => res.json()) .then((res) => { console.log("response" +JSON.stringify(res)); }) .catch((e) => console.log(e)) .done() 

** имя файла необязательно …