0

I'm using react-native-camera(^0.6.0) in my app, I have to upload the recorded video to server as multipart data. In android they are posting like this,

{
  _parts: [
    [
      'file',
      {
        name: 'VID_20181130_150959.mp4',
        uri: 'file:///storage/emulated/0/DCIM/VID_20181130_150959.mp4',
        type: 'video/mp4'
      }
    ]
  ]
}

but in iOS the file path is returning as assets-library://asset/asset.mov?id=41B76A24-1018-46C1-A658-C1EFFC552FD0&ext=mov but if I post the assets path it's not uploading.

{
  _parts: [
    [
      'file',
      {
        name: '41B76A24-1018-46C1-A658-C1EFFC552FD0.mov',
        uri: 'assets-library://asset/asset.mov?id=41B76A24-1018-46C1-A658-C1EFFC552FD0.mov',
        type: 'video/mov'
      }
    ]
  ]
}

Can anyone help me out with this????

I'm using iPhone 6 for debugging the code,

var url = DomainAPI.lashHostname + '/attachments?token=' + value + '&class=Quick';
fetch(url, {
      method: 'POST',
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'multipart/form-data',
      },
      body: JSON.stringify(formData)
    }).then((response) => response.json())
      .then((responseData) => {
        console.log('responseData------->************$$$$$$$$$$$' + JSON.stringify(responseData));
        if (responseData.error.code == 0) {
          this.sendFiletoServer(responseData.id, value);
        } else {
          this.setState({ loading: false });
          Actions.pop();
        }
      }).catch((err) => {
        console.log('responseData-------> err ************$$$$$$$$$$$' + JSON.stringify(err));
        this.setState({ loading: false });
        Actions.pop();
      });
James Matthew
  • 435
  • 1
  • 6
  • 10
  • Can you show your upload codes? in Expo Snack maybe? – Raptor Dec 03 '18 at 08:35
  • Kindly check above @Raptor added there – James Matthew Dec 03 '18 at 10:49
  • Still can't see the key part, i.e. how do you generate the `formData`. Read [this](https://medium.com/react-native-training/uploading-videos-from-react-native-c79f520b9ae1) and [this](https://github.com/react-native-community/react-native-camera/blob/master/docs/RNCamera.md) – Raptor Dec 04 '18 at 03:03

1 Answers1

2

See This code worked for me hope it helps

 let formData = new FormData();
  formData.append("videoFile", {
    name: name.mp4,
    uri: video.uri,
    type: 'video/mp4'
});
formData.append("id", "1234567");

try {
    let response = await fetch(url, {
        method: 'post',
        headers: {
            'Content-Type': 'multipart/form-data',
        },
        body: formData
    });
    return await response.json();
}
catch (error) {
    console.log('error : ' + error);
    return error;
Harsh Srivastava
  • 349
  • 3
  • 11