Сетевой запрос на передачу разнотипных данных (React-Native v0.59.4)
На форме представлены разнотипные данные, среди которых и файл. Компонент для работы с файлом записывает в стейт объект следующего содержимого:
photo = {
fileName: 'TEST.png', type: 'image/png', fileSize: 63780,
width: 210, height: 118, isVertical: true, originalRotation: 0,
path: '/storage/emulated/0/Pictures/TEST.png',
uri: 'content://com.google.android.apps.photos.contentprovider/-1/1/content://media/external/images/media/22/ORIGINAL/NONE/565507547'
}
Основной объект данных для передачи:
data = {
id: 10, name: 'John Smith', ...
}
В манифесте такие пермишены:
<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
<uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
<uses-permission android:name="android.permission.CAMERA"/>
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.DOWNLOAD_WITHOUT_NOTIFICATION"/>
<uses-permission android:name="android.permission.DOWNLOAD_COMPLETE"/>
Cетевая API принимает данные формата 'Content-Type': 'application/x-www-form-urlencoded'
Т.е. в обычном случае я делал простой запрос:
fetch('https://site.com/api/sender', {
method: 'POST',
headers: { Accept: 'application/json', 'Content-Type': 'application/x-www-form-urlencoded' },
body: `id=${data.id}&name=${data.name}&...`
}).then(res => res.json()).then(({success, status}) => {
if (success) {
// response success
...
} else {
// response error
...
}
});
И теперь самое интересное: как сформировать BODY под 'application/x-www-form-urlencoded', где среди прочих передаваемых параметров DATA будет и параметр для передачи PHOTO.
Так же очень важно, чтобы способ работал в React-Native для платформ Android/iOS (проект собирается под обе платформы, и не хотелось бы проблем с нативной адаптацией).