Firebase 3 + Ionic 2 + cordova-plugin-camera - Upload files

[Eusthace Corin]

I am trying to upload photos to firebase storage using the cordova-plugin-camera with no success:

Here is my code:

let options:any = {
    quality : 100,
    destinationType : Camera.DestinationType.DATA_URL,
    sourceType : Camera.PictureSourceType.CAMERA,
    allowEdit : false,
    encodingType: Camera.EncodingType.JPEG,
    mediaType: Camera.MediaType.PICTURE,
    targetWidth: 1920,
    targetHeight: 1920,
    saveToPhotoAlbum: true,
    cameraDirection: Camera.Direction.FRONT
};

Camera.getPicture(this.options).then( (imageData) => {

                let blob: any = new Blob( [imageData], { type: "image/jpeg" } );
                blob.name = 'image.jpg';

                let storageRef: any = firebase.storage().ref();
                let path: string = 'images/' + this.user.uid + '/' + Math.random().toString(36).substr(2, 9) + '.jpg';

                console.log(path);

                let uploadTask: any = storageRef.child(path).put(blob);

                uploadTask.on('state_changed', function(snapshot) {
                    console.log(snapshot);
                }, function(error) {
                    this.showAlert(error);
                }, function() {
                    var downloadURL = uploadTask.snapshot.downloadURL;
                    console.log(downloadURL);

                    console.log(this.user);

                    this.user.set({photo: downloadURL});
                });

            }, (err) => {
                this.showAlert(err);
            });

I don't know why but it seems that its uploading and when I check the file is empty.

Any help, please?

Thank you.

[Alberto Aznar]

Check this!

First get File, then read to create a Blob.

window.resolveLocalFileSystemURL(fileURI, function( fileEntry ){

  fileEntry.file(function (resFile) {

    var reader = new FileReader();
    reader.onloadend = function(evt) {

      var imgBlob = new Blob([evt.target.result], {type: 'image/jpeg'});
      imgBlob.name = 'sample.jpg';

      var uploadTask = FirebaseControls.storage('images/sample.jpg').put(imgBlob);

      uploadTask.on('state_changed', function(snapshot){

        console.log('state_changed');

      }, function(error) {

        console.log(JSON.stringify(error));
      }, function() {
        // Handle successful uploads on complete
        // For instance, get the download URL: https://firebasestorage.googleapis.com/...
        var downloadURL = uploadTask.snapshot.downloadURL;
      });
    };

    reader.readAsArrayBuffer(resFile);

  });

});

[Rhea Dimayacyac]

hi Alberto Aznar,

im recording an audio using ionic 2 and saving to firebase but doenst work

here is my code, i hope you can help me 

stopRecord() {

console.log("stop record:");

console.log(JSON.stringify(this.newFile));

this.newFile.stopRecord();

//SAVING TO FIREBASE

// Points to the root reference

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

// Points to 'images'

var recordsRef = storageRef.child('record');

// Points to 'images/space.jpg'

// Note that you can use variables to create child values

var fileName = 'record.mp3';

var spaceRef = recordsRef.child(fileName);

// File path is 'images/space.jpg'

var path = spaceRef.fullPath

// File name is 'space.jpg'

var name = spaceRef.name

// Points to 'images'

var recordsRef = spaceRef.parent;

//UPlOAD FILES

// File or Blob

var file = (name:"record.mp3");

// Create the file metadata

var metadata = {

contentType: 'record/mp3'

};

// Upload file and metadata to the object 'images/mountains.jpg'

var uploadTask = storageRef.child('record/' + file.name).put(file, metadata);

// Listen for state changes, errors, and completion of the upload.

uploadTask.on(firebase.storage.TaskEvent.STATE_CHANGED, // or 'state_changed'

function(snapshot) {

// Get task progress, including the number of bytes uploaded and the total number of bytes to be uploaded

var progress = (snapshot.bytesTransferred / snapshot.totalBytes) * 100;

console.log('Upload is ' + progress + '% done');

switch (snapshot.state) {

case firebase.storage.TaskState.PAUSED: // or 'paused'

console.log('Upload is paused');

break;

case firebase.storage.TaskState.RUNNING: // or 'running'

console.log('Upload is running');

break;

}

}, function(error) {

switch (error.code) {

case 'storage/unauthorized':

// User doesn't have permission to access the object

break;

case 'storage/canceled':

// User canceled the upload

break;

    

    case 'storage/unknown':

      // Unknown error occurred, inspect error.serverResponse

      break;

}

}, function() {

// Upload completed successfully, now we can get the download URL