RN - Video upload not working on iOS device (unless through proxy)

I have a super weird issue.I have a React Native app, where you can upload the videos. It works on Android (both device and simulator) and iOS simulator. It doesn't work on iOS device (that might not be 100% true, because when I got random hot-reloads on upload screen I think it worked a couple of times... or maybe someone else was uploading at the same time... - bottom line is it's not working 99% of the times). And by not working I mean, I'm still getting 200 in return, but video is definitely not in there.

I was wondering if there's something with the request so I decided to send whole traffic through Charles Proxy. But as soon as I do that, video upload works EVERY SINGLE TIME! I'm not sure what to make of this, but it's driving me insane. Does anyone know what could cause such a behaviour? Or what could be the difference when I just proxy the requests? It shouldn't add any extra headers or anything right that, right?

Since it's working on Android and simulator my guess is it's not the bug in the code, but maybe some magic iOS permissions. Or maybe there's something wrong with backend... Here's the code anyway.

I'm using the following libs:

• react-native-image-picker for selecting a video
• rn-fetch-blob for uploading

Selecting video file:

import React, { useState } from 'react';import {  View,  Text,  TouchableOpacity,} from 'react-native';import ImagePicker from 'react-native-image-picker';const Main = () => {  const [selectedVideo, setSelectedVideo] = useState();  const selectVideo = () => {    const options = {      title: '',      takePhotoButtonTitle: 'Take Video...',      mediaType: 'video',      videoQuality: 'high',      allowsEditing: false    };    ImagePicker.showImagePicker(options, (response) => {      if (response.didCancel) {        console.log('User cancelled video picker');      } else if (response.error) {        console.log('ImagePicker Error: ', response.error);      } else if (response.customButton) {        console.log('User tapped custom button: ', response.customButton);      } else {        // SUCCESS        console.log('Video selected: ', response);        setSelectedVideo(response);      }    });  };  return (<><View><TouchableOpacity          onPress={() => selectVideo()} ><Text>SELECT VIDEO</Text></TouchableOpacity></View></>  );};export default Main;

Example of videoData object:

{    fileName: "IMG_0001.MOV"    latitude: 0.0    longitude: 0.0    origURL: "assets-library://asset/asset.MOV?id=79B0BFFB-0A7A-4E5A-B5A5-6A5B1696904D&ext=MOV"    timestamp: "2020-06-13T15:57:43Z"    uri: "file:///var/mobile/Containers/Data/Application/F0E74319-E698-4180-90E1-767155011EAC/tmp/trim.51E732F4-55D9-4A65-9226-F972532F4435.MOV"}

Uploading the file:

import { Platform } from 'react-native';import RNFetchBlob from 'rn-fetch-blob';const rootUrl = 'https://my.server.com';const TOKEN = "SuperSecretToken";const uploadVideo = (videoData, fileName) => {    const { uri } = videoData;    const url = `${ROOT_URL}/video/upload`;    const headers = {'Authorization': TOKEN,'Content-Type': 'multipart/form-data',    };    const contentType = Platform.OS === 'ios' ? 'video/quicktime' : 'video/mp4';    const fileName = uri.replace(/^.*[\\\/]/, '');    const realPath = Platform.OS === 'ios' ? uri.replace('file://', '') : uri;    const body = [{        name: 'video',        type: contentType,        filename: fileName,        data: RNFetchBlob.wrap(decodeURIComponent(realPath)),    }];    RNFetchBlob        .fetch('POST',            encodeURI(url),            headers,            body        )        .uploadProgress((written, total) => {            console.log("Progress:", written / total);        })        .then((res) => {            let status = res.info().status;            if (status == 200) {                console.log("Res json =>", res.json());            } else {                console.log("Error", err);            }        })        .catch((err) => {            console.log("Error (catch) =>", err);        })};

Any hints appreciated.