使用 cordovaFileTransfer 将视频上传到 firebase (3.0) 存储

Uploading video to firebase (3.0) storage using cordovaFileTransfer

我正在使用 Ionic、(ng)Cordova 和 Firebase 存储创建混合应用程序。

以前,将 Cordova 媒体捕获(例如用于捕获视频)和 Cordova 文件传输(用于将其上传到某处)配对工作类似于 状态。

我正在努力研究如何使用不使用服务器地址的新 Firebase 存储上传过程实现相同的目的:

var uploadTask = storageRef.child('videos/' + file.name).put(file);

我觉得我现在需要添加另一个步骤来实际从设备访问文件 - 这以前由文件传输插件处理。

我可能遗漏了一些非常明显的东西 - 如果是这样,我们深表歉意并表示感谢。

好的,我终于搞定了。

如果您想使用 here 中描述的新的 firebase 存储上传方法,您不想再使用 Cordova FileTransfer 插件(它为您完成了一些肮脏的工作)。

您现在需要先使用 (ng)Cordova 文件插件读取文件。根据您的文件,您应该以最合适的方式 read it - 在我的例子中,因为我试图读取视频,所以我将其作为数组缓冲区读取。

读取后需要转成blob(看语法),然后上传运行顺利:

  var file_path = "root/to/directory";
  var name = "filename.mp4";

                $cordovaFile.readAsArrayBuffer(file_path, name)
                    .then(function (success) {
                        // success
                        console.log(success);

                      blob = new Blob([success], {type: "video/mp4"});

                      console.log(blob);

                      var uploadTask = storageRef.child(name).put(blob);

                      uploadTask.on('state_changed', function(snapshot){
                        // Observe state change events such as progress, pause, and resume
                        // See below for more detail

                          var progress = (snapshot.bytesTransferred / snapshot.totalBytes) * 100;
                          console.log('Upload is ' + progress + '% done'); 

                      }, function(error) {
                        // Handle unsuccessful uploads
                        console.log("Error uploading: " + error)
                      }, function() {
                        // Handle successful uploads on complete
                        // For instance, get the download URL: https://firebasestorage.googleapis.com/...
                        var downloadURL = uploadTask.snapshot.downloadURL;
                        console.log("Success!", downloadURL);
                      });

                      }, function (error) {
                        // error
                        console.log("Failed to read video file from directory, error.code);

                      }

                      );

注意:1)这里指的是web/javascriptAPI-android和iOSAPI会有所不同。 2) 请记住文件类型可能因设备而异,因此您需要处理这个 3) 我使用的是 ngCordova,但这同样适用于常规 cordova/phonegap 插件。

希望这对您有所帮助。