Angular httpClient - post file along with dto - spring web @PostMapping

37 Views Asked by At

Here is the angular httpClient post request :

submit() {
  var formData: any = new FormData();

  let videoDto = 
    {"name": this.form.get('name')?.value,
    "code": null,
    "storageName": null,
    "category": "vacances"};

  formData.append('data', JSON.stringify(videoDto));
  formData.append('file', this.form.get('file')?.value);
  
  this.http.post('http://localhost:8095/uploadfile/data', formData).subscribe(
    (response) => console.log(response),
    (error) => {
      console.log(error.message);
    }
  );
}

Here is the spring web end point :

@PostMapping(value ="/uploadfile/data")
public ResponseEntity<FileUploadResponse> createVideo(@RequestPart("data") VideoDto data, @RequestParam("file") MultipartFile multipartFile) throws IOException, ImageAllreadyOwenedException 
{   
    FileUploadResponse response = fileSystemStorage.storeFile(multipartFile);

    return new ResponseEntity<FileUploadResponse>(response, HttpStatus.OK);
}

Here is the Exception in spring spring web application :

2024-01-23T09:34:44.670+01:00  WARN 9504 --- [nio-8095-exec-1] .w.s.m.s.DefaultHandlerExceptionResolver : Resolved [org.springframework.web.HttpMediaTypeNotSupportedException: Content-Type 'application/octet-stream' is not supported]

here is the postman test : enter image description here

The postman test is OK.

How to post dto data and file in the same http post request angular/spring boot ?

0

There are 0 best solutions below