从Cordova应用程序将图像上传到Firebase存储 [英] Uploading image to Firebase Storage from Cordova app

查看:409
本文介绍了从Cordova应用程序将图像上传到Firebase存储的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试将图片从我的Cordova应用程式上传到新的Firebase储存空间。这是我到目前为止所尝试的。



  //从PhotoLibrarynavigator.camera.getPicture ,onFail,{quality:quality,sourceType:Camera.PictureSourceType.PHOTOLIBRARY,destinationType:Camera.DestinationType.FILE_URI,targetWidth:imageSize,targetHeight:imageSize}); function onSuccess(imageData){var storageRef = firebase.storage (); window.resolveLocalFileSystemURL(imageData,function(fileEntry){fileEntry.file(function(file){var uploadTask = storageRef.child('images / test.jpg')。put(file); uploadTask.on('state_changed',function (snapshot){console.log(snapshot);});})};  



这会导致以下错误

  FirebaseError:Firebase存储:索引0处的`put`中的参数无效:预期的Blob或文件

我试过的另一件事是将图像作为base64并转换为Blob,但结果相同。



有没有人知道如何获取Javascript文件或Blob格式的图像Firebase存储需要? $ b

解决方案

来自Sam上面的链接指向了正确的方向,这是一个有效的解决方案。



navigator.camera.getPicture(onSuccess,onFail,{quality:quality,sourceType:Camera.PictureSourceType.PHOTOLIBRARY,destinationType:Camera.DestinationType.FILE_URI,targetWidth:imageSize, targetHeight:imageSize}); function onSuccess(imageData){var storageRef = firebase.storage()。ref(); var getFileBlob = function(url,cb){var xhr = new XMLHttpRequest(); xhr.open(GET,url); xhr.responseType =blob; xhr.addEventListener('load',function(){cb(xhr.response);}); xhr.send(); }; var blobToFile = function(blob,name){blob.lastModifiedDate = new Date(); blob.name = name; return blob; }; var getFileObject = function(filePathOrUrl,cb){getFileBlob(filePathOrUrl,function(blob){cb(blobToFile(blob,'test.jpg'));}); }; getFileObject(imageData,function(fileObject){var uploadTask = storageRef.child('images / test.jpg')。put(fileObject); uploadTask.on('state_changed',function(snapshot){console.log };});},function(error){console.log(error);},function(){var downloadURL = uploadTask.snapshot.downloadURL; console.log(downloadURL); // handle image} code>


I am trying to upload an image from my Cordova app to the new Firebase Storage. This is what I have attempted so far.

// Get the image from PhotoLibrary
navigator.camera.getPicture(onSuccess, onFail, { 
  quality: quality,
  sourceType: Camera.PictureSourceType.PHOTOLIBRARY,
  destinationType: Camera.DestinationType.FILE_URI,
  targetWidth: imageSize,
  targetHeight: imageSize
});

function onSuccess(imageData) {
  
  var storageRef = firebase.storage().ref();
  
  window.resolveLocalFileSystemURL(imageData,
	function(fileEntry) {
	  fileEntry.file(function(file) {
          var uploadTask = storageRef.child('images/test.jpg').put(file);
          uploadTask.on('state_changed', function(snapshot){
	    console.log(snapshot);
          });
	}                     
   )
};

This results in the following error

FirebaseError: Firebase Storage: Invalid argument in `put` at index 0: Expected Blob or File.

One other thing I have tried is getting the image as base64 and converting to a Blob, but same result.

Does anyone one know how to get the image in the Javascript File or Blob formats that Firebase Storage requires? Thanks!

解决方案

The link from Sam above led me in the right direction. Here is a working solution.

navigator.camera.getPicture(onSuccess, onFail, {
    quality: quality,
    sourceType: Camera.PictureSourceType.PHOTOLIBRARY,
    destinationType: Camera.DestinationType.FILE_URI,
    targetWidth: imageSize,
    targetHeight: imageSize
});

function onSuccess(imageData) {

    var storageRef = firebase.storage().ref();

    var getFileBlob = function(url, cb) {
        var xhr = new XMLHttpRequest();
        xhr.open("GET", url);
        xhr.responseType = "blob";
        xhr.addEventListener('load', function() {
            cb(xhr.response);
        });
        xhr.send();
    };

    var blobToFile = function(blob, name) {
        blob.lastModifiedDate = new Date();
        blob.name = name;
        return blob;
    };

    var getFileObject = function(filePathOrUrl, cb) {
        getFileBlob(filePathOrUrl, function(blob) {
            cb(blobToFile(blob, 'test.jpg'));
        });
    };

    getFileObject(imageData, function(fileObject) {
        var uploadTask = storageRef.child('images/test.jpg').put(fileObject);

        uploadTask.on('state_changed', function(snapshot) {
            console.log(snapshot);
        }, function(error) {
            console.log(error);
        }, function() {
            var downloadURL = uploadTask.snapshot.downloadURL;
            console.log(downloadURL);
            // handle image here
        });
    });

}

这篇关于从Cordova应用程序将图像上传到Firebase存储的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆