Ionic 将 Video URI 转换为 File 对象以上传到 Firebase

Question

我想将视频路径 URI 转换为文件对象以上传到 Filebase 存储。但是在我选择了视频并打电话后

window.resolveLocalFileSystemURL(...)

它永远不会提醒 File 并且 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);

  }

谢谢

附言。我正在使用 Ionic v.4

Answer 1

您可以使用 ionic-native MediaCapture & File Plugins 并像这样录制视频：

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