How to store video in firebase storage using video file path in React-native

Question

when i get path of video so what i do to store that video on firebase storage using react-native?

file://storage/emulated/0/DCIM/1234.MP4.... I get that path

here is my code where i created video recorder and fetch that recorded video file path.

import Camera from 'react-native-camera';

    <Camera
                captureMode={this.state.captureMode}
                captureAudio={this.state.captureAudio}
                captureTarget={this.state.captureTarget}
                ref="camera"
                style={styles.preview}>

   { toggle? <TouchableOpacity onPress={() =>this._startRecord()}>
                           <Image style={styles.clickimage}
                             source={require('../images/icon_record_stop.png')} /> 
                      </TouchableOpacity>
            : <TouchableOpacity onPress={() =>this._endVideo()}>
                  <Image style={styles.clickimage}
                             source={require('../images/clickimage.png')} /> 
              </TouchableOpacity>
            }
      </Camera>


     _startRecord() {
      this.refs.camera.capture({mode: Camera.constants.CaptureMode.video})
    .then((data) => {
      this.setState({
          storagepathdata:data.path
        });
    //  var path = data.path;
    })
        .catch((err) => console.log(err))
      }

_endVideo() {
     this.refs.camera.stopCapture()
    .then((response) => {                                      
              alert(this.state.storagepathdata);

         // here storagepathdata is a file path so what i do to store that video on firebase?      
    } 

Answer 1

set video path in fs.readFile(video, 'base64') and it will return blob then set blob and contentType which is for video : 'video/mp4' and fter file upload firebase return video URL in response on last promise

and dont forget to install and import

 import RNFetchBlob from 'react-native-fetch-blob';

const sessionId = new Date().getTime();
  const Blob = RNFetchBlob.polyfill.Blob;
  const fs = RNFetchBlob.fs;
  window.XMLHttpRequest = RNFetchBlob.polyfill.XMLHttpRequest;
  window.Blob = Blob;        
  let uploadBlob = null;
  let mime = 'video/mp4';
  const firebaseRef = firebase.storage().ref("video").child(`${sessionId}`);
  return fs.readFile(video, 'base64') 
  .then((data) => {   
    console.log("data", data)             
      return Blob.build(data, { type: `${mime};BASE64` })
  })
  .then((blob) => {
    console.log("blob", blob)    
      uploadBlob = blob;
      return firebaseRef.put(blob, { contentType: mime })
  })
  .then((res) => {
    console.log("res", res)  
      uploadBlob.close();
      return firebaRef.getDownloadURL()
    })
    .then((res) => {
      console.log("URL", res)

  })