Ionic Native 视频上传损坏的文件

Posted 2023-03-16

【中文标题】Ionic Native 视频上传损坏的文件

【英文标题】：Ionic Native video uploads a corrupted file

【发布时间】：2022-01-02 10:33:49

【问题描述】：

我的 Ionic Native 应用目前一直存在问题。

我正在尝试将视频文件上传到 Firebase 存储，我使用 Media Capture 处理录制：

"@ionic-native/media-capture": "^5.36.0""

到目前为止这么好..当我尝试将这个新文件上传到 Firestore 时，文件总是上传损坏...或者文件大小只有 9 字节！？？

这是我现在使用的代码：

this.mediaCapture.captureVideo(duration: 10, quality: 0).then(
        (data: MediaFile[]) => 
          if (data.length > 0) 
            let originname = data[0].fullPath.substr(data[0].fullPath.lastIndexOf('/') + 1);
            let originpath = data[0].fullPath.substr(0, data[0].fullPath.lastIndexOf('/') + 1);            
            
            let alerta = this.alerts.create(
              buttons: ['ok'],
              message: this.file.externalDataDirectory
            );
            alerta.then(set => set.present());
            this.file.copyFile(originpath, originname, this.file.externalDataDirectory, 'video.mp4')
            .then(result =>
              //let video = (document.getElementById('myvideo') as htmlVideoElement).src = result.nativeURL;
           

              //let path =this.webview.convertFileSrc(result.nativeURL);
              // this.video = path;

              // let alert = this.alerts.create(
              //   buttons: ['ok'],
              //   message: path
              // );
              // alert.then(set => set.present());
              
              
              // let videoname = path.substr(path.lastIndexOf('/') + 1);
              // let videopath = path.substr(0, path.lastIndexOf('/') + 1);        
              const data = Filesystem.readFile(
                path: result.nativeURL
              )
              .then(data =>
                let blob= new Blob([data.data], type: 'video/mp4');
                let ref = this.storage.storage.ref().child('videoTests').child('video.mp4')
                ref.put(blob).then(
                  result =>
                    let url = this.storage.ref('/videoTests/'+588+'.mp4').getDownloadURL();
                    url.subscribe(result =>
                      console.log(result);
                      let alert = this.alerts.create(
                        buttons: ['ok'],
                        message: result
                      );
                      alert.then(set => set.present());
                      )
                  ) 

注意：对于上下文，我尝试使用本机 File readAsDataURL 但承诺永远不会解决..在控制台中我看到它正在处理但最后它只是卡住并且永远不会解决..

离子 6.16.3 Angular 核心 12.1.1 节点 14.15.0

非常感谢任何帮助或指导，我现在有好几天陷入困境......

[已解决]

【问题讨论】：

已解决：现在已解决... Filesystem.readFile 的结果是 base64，所以我要做的就是将此结果作为 base64 处理，然后将其转换为 blob，这样可以成功上传有效视频文件。

【参考方案1】：

已解决：现在已解决... Filesystem.readFile 的结果是 base64，所以我所要做的就是将此结果作为 base64 处理，然后将其转换为 blob，从而成功上传有效的视频文件。