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

【问题标题】：Uploading video to firebase (3.0) storage using cordovaFileTransfer使用 cordovaFileTransfer 将视频上传到 firebase (3.0) 存储
【发布时间】：2016-07-18 14:59:14
【问题描述】：

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

以前，将 Cordova 媒体捕获（例如用于捕获视频）和 Cordova 文件传输（用于将其上传到某处）配对的工作方式类似于 this question states。

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

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

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

我可能遗漏了一些非常明显的东西 - 如果是这样，道歉并感谢。

【问题讨论】：

已经回答了您需要更新的只是 firebase 3 语法stackoverflow.com/questions/34380654/…
不，您所指的答案仅涉及将 本地视频路径 添加到“firebase 数据库”。我正在尝试研究如何将该本地视频文件本身上传到新的“firebase 存储”。

标签： cordova-plugins firebase-storage

【解决方案1】：

好吧，我终于搞定了。

如果您想使用 here 中描述的新的 firebase 存储上传方法，您不再想使用 Cordova FileTransfer 插件（它为您做了一些麻烦的工作）。

您现在需要先使用 (ng)Cordova File 插件读取文件。根据您的文件，您应该以最合适的方式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/javascript API - android 和 iOS API 会有所不同。 2) 请记住文件类型可能因设备而异，因此您需要处理此问题 3) 我使用的是 ngCordova，但同样适用于常规的 cordova/phonegap 插件。

希望对您有所帮助。

【讨论】：