Angular 2 - Firebase Storage -putString() method support metadata?

Question

I have a simple function in my ionic 2 app to upload a file to my firebase storage server. It grabs a base64 encoded string of an image from a Camera, but when I don't try to force the content-type, it defaults to application/octet-stream. When I try to add the metadata to the putString() method, I get errors.

Does anyone know how I can do this with putString?

Here is my current function:

uploadProfilePhoto(file) {
    this.storage.get('user').then(user => {
      let id = user.id;

      var metadata = {
        contentType: 'image/jpeg',
      };

      let userProfileRef = this.fbStorage.ref(`/users/${id}/profile_photo/profile_photo.jpg`);
      userProfileRef.putString(file, metadata).then(snapshot => {
      }).catch(error => {
      });
    })
  }

Casaleggio

Answer 1

So with this, I was missing a parameter to specify base64. Here is the updated function:

uploadProfilePhoto(file) {
    this.storage.get('user').then(user => {
      let id = user.id;

      var metadata = {
        contentType: 'image/jpeg',
      };

      let userProfileRef = this.fbStorage.ref(`/users/${id}/profile_photo/profile_photo.jpg`);
      userProfileRef.putString(file, 'base64', metadata).then(snapshot => {
      }).catch(error => {
      });
    })
  }

Casaleggio

Answer 2

In addition, you should add custom meta data values like so:

var metadata = {
    contentType: 'image/jpeg',
    customMetadata: {
        foo: "bar"
    }
};

for it to be stored correctly

Kimberliekimberlin