How to convert Base64 to Image Object in Ionic 3? - ionic-framework

Question

I am trying to upload an image in Ionic 3 but I got image in Base64, so I want to convert it into Image file Object.
How do I convert it?
Here is my component code
this.camera.getPicture(options).then((imageData) => {
let base64Image = 'data:image/jpeg;base64,' + imageData;
this.profilePhoto['profile_photo'] = base64Image;
let formData = new FormData();
let blob: Blob = this.utilService.convertBase64ToImage(base64Image);
let file = new File([blob], this.utilService.newGuid() + '.jpg', { type: 'image/jpeg' });
let newFileObj = this.utilService.convertFileObject(file);
formData.append('profile_photo', newFileObj);
this.updatePhoto(formData);
}, (err) => {
console.log(err);
});
with this code i did't get image object like web, so how to convert this base64 into image object like Web

Answer 1

Can you try something like this? If you converted your base64 to a Blob correctly, you should be able to put the blob directly into the FormData (no need to convert to a File). Then upload to your API.
let blob: Blob = this.utilService.convertBase64ToImage(base64Image);
await this.uploadImage(blob);
uploadImage(imageBlob: Blob, fileName = "imageUpload.png") {
let p = new Promise<void>((resolve, reject) => {
let formData: FormData = new FormData();
formData.append('uploadFile', imageBlob, fileName);
let params = new HttpParams();
this.httpClient.post('http://YOUR_API_HERE', formData,
{
responseType: 'text', //Empty response is expected, no JSON
})
.subscribe(
data => {
// We don't care what we get back here...
resolve();
},
error => {
//We didn't get data back
console.log("Error submitting image upload")
let e = new Error("Error uploading an image");
reject(e);
});
});
return p;
}