离子将视频URI转换为File对象以上传到Firebase

时间:2018-11-10 15:17:45

标签: typescript firebase ionic-framework ionic3

我想将视频路径URI转换为文件对象以上传到文件库。但是在我选择了视频并致电

之后

window.resolveLocalFileSystemURL(...)

它永远不会发出警报,并且不会调用uploadToFirebase()。所以,我不知道该怎么做。

doGetPicture() {

    // TODO:
    // get picture from camera

    const options: CameraOptions = {
      quality: 100,
      destinationType: this.camera.DestinationType.FILE_URI,
      sourceType: this.camera.PictureSourceType.PHOTOLIBRARY,
      mediaType: this.camera.MediaType.VIDEO,
    }

    this.camera.getPicture(options).then((_imagePath) => {
      alert('got image path ' + _imagePath);

      window.resolveLocalFileSystemURL(_imagePath, function (fileEntry) {
        fileEntry.file(function (file) {
          alert('got file! '+file);
          console.log('File__++ ', file);
        });
      });

    });

  }


uploadToFirebase(file) {

    // Create the file metadata
    var metadata = {
      contentType: 'video/mp4'
    };

    // Upload file and metadata to the object 'videos/test.mp4'
    this.fbRef.child('videos/' + file.name).put(file, metadata);

  }

谢谢

PS。我正在使用Ionic v.4

1 个答案:

答案 0 :(得分:0)

您可以使用离子本机MediaCapture和文件插件来录制视频,如下所示:

recordVid() {
  let options: CaptureVideoOptions = { limit: 1, duration: 5 }
  this.mediaCap.captureVideo(options).then((data: MediaFile[]) => {
    let capturedVid = data[0];
    let localVideoPath = capturedVid.fullpath;
    let directoryPath = localVideoPath.substr(0, localVideoPath.lastIndexOf('/'));
    let fileName = localVideoPath.substr(localVideoPath.lastIndexOf('/') + 1); 
    this.file.readAsArrayBuffer(directoryPath, fileName).then((result) => {
      console.log(result);
      let blob = new Blob([result], { type: "video/mp4" });
      //then upload the blob to firebase storage
      this.uploadToFirebase(blob);
    });
//catch errors here and maybe add a function to play video in frontend
}

UploadTask本身描述如下: Upload Video Blob to firebase