Ionic 4 capacitor upload image to server

I have used the capacitor plugin to let user capture images and then we can store it in our server(spring).

async takePicture() {
    const image = await Plugins.Camera.getPhoto({
      quality: 100,
      allowEditing: false,
      resultType: CameraResultType.DataUrl,
      source: CameraSource.Prompt, 
    }); = this.sanitizer.bypassSecurityTrustResourceUrl(image && (image.dataUrl));



Now , I want to store image with some other data like name, etc.


httpOptions2 = {
    headers: new HttpHeaders({ 'Content-Type': 'multipart/form-data' })

addReport (user): Observable<any> {
    return<any>(this.url , user,this.httpOptions2 )


let report = {
        address : this.address.value, // other data 
        image :,


      this.reportService.addReport(report).subscribe(data =>{

Input type at the server for the image is the file

I have set ‘Content-Type’: ‘multipart/form-data’.

But at the server-side image is not getting stored?

What am I doing wrong?

Getting following error on server

Failed to parse multipart servlet request; nested exception is org.apache.tomcat.util.http.fileupload.FileUploadException: the request was rejected because no multipart boundary was found

Thank you in advance

You can try to pass a proper FormData object rather than your report one.
let formData: FormData = new FormData();

You can find explanations how to use Using FormData Objects here.
Note it is meant to convey binary content.