How to convert base64 image to blob in ionic - ionic-framework

Question

I am working with ionic 3 framework.and i don't know how to convert base64 image to blob Thank you.
.ts file
openCamera() {
let actionSheet = this.actionSheetCtrl.create({
title: 'Edit Your Profile Picture',
buttons: [
{
text:'Camera',
icon: 'ios-camera',
role: 'destructive',
handler: () => {
const options: CameraOptions = {
quality: 100,
destinationType: this.camera.DestinationType.DATA_URL,
saveToPhotoAlbum: true,
mediaType: this.camera.MediaType.PICTURE
}
this.camera.getPicture(options).then((imageData) => {
this.image = 'data:image/jpeg;base64,' + imageData;
}, (err) => {
alert(err)
});
}
},
{
text: 'Gallery',
icon: 'ios-images',
handler: () => {
const options: CameraOptions = {
quality: 50,
destinationType: this.camera.DestinationType.DATA_URL,
encodingType: this.camera.EncodingType.JPEG,
mediaType: this.camera.MediaType.PICTURE,
correctOrientation: true,
sourceType:this.camera.PictureSourceType.PHOTOLIBRARY,
}
this.camera.getPicture(options).then((imageData) => {
// imageData is either a base64 encoded string or a file URI
// If it's base64 (DATA_URL):
this.image = 'data:image/jpeg;base64,' + imageData;
//this.image = base64Image;
// alert(base64Image);
}, (err) => {
// Handle error
console.log(err);
});
}
},
{
text: 'Cancel',
role: 'cancel',
handler: () => {
}
}
]
});
actionSheet.present();
}
.html file
<img (click)="openCamera()" [src]="domSanitizer.bypassSecurityTrustUrl(image)" class="before-img" >

Answer 1

Default setting is the file URI (blob) according to this:
https://ionicframework.com/docs/native/camera/#CameraOptions
So you can alter your current options here to request FILE URI instead of DATA URL (as your current options set to use DATA URL which is base64):
const options: CameraOptions = {
quality: 50,
destinationType: this.camera.DestinationType.FILE_URI,
encodingType: this.camera.EncodingType.JPEG,
mediaType: this.camera.MediaType.PICTURE,
correctOrientation: true,
sourceType:this.camera.PictureSourceType.PHOTOLIBRARY,
}
You can also omit setting this explicitly and then in theory the default will be used...