Image Encoding issue in ionic 3


#1

I want to display an action sheet with options to select from gallery or from camera and then send base64 encoded string to the API.But when I select from camera it is throwing me Payload too large error.I even tried clicking a pic from camera and then selecting it froom gallery in the app but it is doing same. Below is my code.Thanks in advance :slight_smile:

public takePicture(sourceType) {
// Create options for the Camera Dialog
var options = {
quality: 50,
sourceType: sourceType,
saveToPhotoAlbum: false,
correctOrientation: true,
//encodingType: this.camera.EncodingType.JPEG,
destinationType: 0
};
// Get the data of an image
this.camera.getPicture(options).then((imagePath) => {
this.pic=imagePath;
this.pictureForExibition=‘data:image/jpeg;base64,’+imagePath;
}, (err) => {
this.presentToast(‘Error while selecting image.’);
});
}
and the API hit

supply_details(supplyData){
console.log(“coming in the function”)
console.log(this.pic);
var url = ‘Myurl’;
var filename = this.createFileName();
var headers = new Headers();
headers.append(“Accept”, ‘application/json’);
headers.append(‘Content-Type’, ‘application/json’ );
headers.append(‘Cache-Control’, ‘no-cache’ );
this.loading = this.loadingCtrl.create({
content: ‘Uploading…’,
});
this.loading.present();
let options = new RequestOptions({ headers: headers });
let body={
“image”:this.pictureForExibition,
“name”:filename
}
console.log(body);
this.http.post(url, body, options)
.subscribe(data => {
console.log(data)
this.loading.dismiss();
this.presentAlert(“Product Upload Successfully”);
this.app.getRootNav().setRoot(SomePage);
}, error => {
console.log(“coming in error”)
this.loading.dismiss();
let er=error.json();
console.log(er);
this.presentAlert(“Error Uploading file to our servers!”);
});
}