Send additional param for file upload

Question

I want to implement file upload from Angular to Spring with one additional param into the request: I tried this:

upload_logo(){
this.merchantService.imports(this.fileToRead, this.merchant.id)
    .subscribe(res => {
        console.log(res);
    });
}

  imports (file: any, id: number) {
    const formData = new FormData();
    formData.append('file', file, file.name);
    return this.http.post(environment.api.urls.merchants.uploadLogo, formData, id);

}

merchants: {
   uploadLogo: baseUrl + '/api_admin/merchants/upload'
}

BE:

@PostMapping(value = "/upload", produces = { MediaType.APPLICATION_JSON_VALUE })
    public ResponseEntity<StringResponseDTO> uploadData(@RequestParam("file") MultipartFile file, RedirectAttributes redirectAttributes, @RequestParam("id") Integer number) throws Exception {
    ....
}

But I get error here:

return this.http.post(environment.api.urls.merchants.uploadLogo, formData, id);

How I need to pass the id number to the POST request?

Buczkowski · Accepted Answer · 2019-08-12 09:35:06Z

1

this.http.post(environment.api.urls.merchants.uploadLogo, formData, {params: {id: id.toString()}});

I added toString because params object should have key as string and value as string or array of strings.

https://angular.io/api/common/http/HttpClient#post

answered Aug 12, 2019 at 9:35

Buczkowski

2,41614 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Peter Penzov Over a year ago

I want to send a number. Are you sure that toString can be sued for number?

Buczkowski Over a year ago

/some/url?param=24 - how you distinguish param value whenever it is an number or string? Provide it as string here and on backend parse to number. Eventually you can pass it to body and you'll get it as number but I don't think it's a good idea.

Peter Penzov Over a year ago

Can you show me how to send it as body param not URL param?

Collectives™ on Stack Overflow

Send additional param for file upload

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related