Ionic File Chooser with upload to Firebase functionality


#1

Hi there,

I’ve recently started to try and use the file chooser in ionic.
I want it so that the user can choose a picture from their gallery, to then upload to firebase storage.

Here is my code…

 // This function allows users to upload a profile photo from their gallery
  uploadFromGallery()
  {
    this.fileChooser.open().then((uri) => {
        alert(uri);

        this.file.resolveLocalFilesystemUrl(uri).then((newUrl) => {
          alert(JSON.stringify(newUrl));

          let dirPath = newUrl.nativeURL;
          let dirPathSegments = dirPath.split('/'); //breaks string into array 
          dirPathSegments.pop(); // remove last element 
          dirPath = dirPathSegments.join('/');

          this.file.readAsArrayBuffer(dirPath, newUrl.name).then(async (buffer) => {
            await this.upload(buffer, newUrl.name);
          })
        })
    })
  }

  // Function which uploads the actual photo to Firebase
  async upload(buffer, name)
  {
    let blob = new Blob([buffer], {type: "image/jpeg"});

    let storage = firebase.storage();

    storage.ref('ProfilePictures/' + name).put(blob).then((d) => {
      alert("Image Upload Done!");
    }).catch((error) => {
      alert(JSON.stringify(error))
    })
  
  }

It runs without error but the file doesn’t get uploaded to firebase storage… any suggestions?
I generated my code by watching this tutorial…

Many thanks


#2

Can anyone help with this request?