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
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!ā);
});
}