Ionic Camera generated string URL size too big to store (as a string) in Firebase

Issue

i am using ionic camera plugin https://ionicframework.com/docs/native/camera to capture image and and store into Firebase, but when i am uploading an image file of size greater than 2 mb , while storing in Firebase it is giving error that string longer than 1048487 bytes. Any suggestion how can i shorten string URL size or any other way of storing any picture of ant size.

My Code :

takePicture()
 {

   const options: CameraOptions = {
   quality: 30,
   destinationType: this.camera.DestinationType.DATA_URL,
   encodingType: this.camera.EncodingType.JPEG,
   mediaType: this.camera.MediaType.PICTURE,
   allowEdit: true,
   sourceType: 1,
   saveToPhotoAlbum: false,
};
   this.camera.getPicture(options).then((imageData) => {
   this.cardopen = !this.cardopen;
   this.takephoto = 'data:image/jpeg;base64,' + imageData;
console.log(this.takephoto);
}, (err) => {
  console.log(err);
});
}

Opera DOM:

core.js:4197 ERROR Error: Uncaught (in promise): FirebaseError: [code=invalid-argument]: The value of 
 property "ImageUrl" is longer than 1048487 bytes.
FirebaseError: The value of property "ImageUrl" is longer than 1048487 bytes.

String Image

Solution

You should upload the image to the firebase storage first. After that you save the download url in your firestore document to show the image.
Upload to firebase storage

With firebase storage you have no limits on data size. Draw back is that the image loads slow, but you can create a firebase function that do some image processing to generate a thumbnail.

Even for this firebase created an extension to resize the image.

Answered By - RSD