Spring boot http POST @RequestParam multiple parameters

Question

I have a spring boot admin server and a angular-client front part. I'm trying to send some data from my front to my server using HTTPClient but somehow I'm getting the following error during my request, but first here is my code :

POST request in angular-client :

  runBatch(id: number, stateUpd: string): Observable<HttpEvent<{}>> {
    const req = new HttpRequest('POST', '/update_state', {id, stateUpd}, {
      reportProgress: true,
      responseType: 'text'
    });
    return this.http.request(req);
  }

Controller in angular-client :

changeBatchState(state: string): void {
        if(this.selection.selected.length >= 1){
            this.selection.selected.forEach(batchInstance =>{
                if(batchInstance.batchState == 'CRASHED' || 'KILLED' || 'SUBMITTED'){
                    console.log(batchInstance.id + " setting to RUNNABLE...");
                    this.dataTableService.runBatch(batchInstance.id, state).subscribe(event => {
                        if(event.type === HttpEventType.UploadProgress) {
                         console.log('POST /update_state sending...');   
                        }
                        else if(event instanceof HttpResponse) {
                         console.log('Request completed !');   
                        }
                    });
                }
                else {
                    console.log(batchInstance.id + ' can not set to RUNNABLE');
                }
            });
        }
    }

Controller in admin server :

    @PostMapping("/update_state")
    public ResponseEntity<String> batchChangeState(@RequestParam("id") int id, @RequestParam("stateUpd") String stateUpd) {
        try {
            log.i("INSIDE CONTROLLER");
            log.i("BATCH INSTANCE ID : " + id);
            log.i("UPDATE REQUESTED : " + stateUpd);

        return ResponseEntity.status(HttpStatus.OK).body("Batch instance: " + id + " updated");
        } catch (Exception e) {

        return ResponseEntity.status(HttpStatus.EXPECTATION_FAILED).body("Fail to update batch instance " + id);
        }
    }

and here the error I get during the request :

ERROR 
Object { headers: {…}, status: 400, statusText: "OK", url: "http://localhost:8870/update_state", ok: false, name: "HttpErrorResponse", message: "Http failure response for http://localhost:8870/update_state: 400 OK", error: "{\"timestamp\":1517473012190,\"status\":400,\"error\":\"Bad Request\",\"exception\":\"org.springframework.web.bind.MissingServletRequestParameterException\",\"message\":\"Required int parameter 'id' is not present\",\"path\":\"/update_state\"}" }

I don't understand where it comes from since I'm sending the id correctly in my POST request, any ideas ?

Can you check your post request in developer console? You can try to send parameters like this: new HttpRequest('POST', `\`/update_state?id=${id}&stateUpd=${stateUpd}\``,... — vegazz, Feb 01 '18 at 08:43
I'm getting this error trying like that : `Error parsing HTTP request header` right now debugging to give you the request form.. — Logan Wlv, Feb 01 '18 at 09:22

Pierre Mallet · Accepted Answer · 2018-02-01T10:58:39.410

1

const req = new HttpRequest('POST', '/update_state', {id, stateUpd}, {

will create a request where {id, stateUpd} are in the body, not in the queryParams.

You should do

// change : Body = null, and data are in options.params    
runBatch(id: number, stateUpd: string): Observable<HttpEvent<{}>> {
        const req = new HttpRequest('POST', '/update_state', null, {
          reportProgress: true,
          responseType: 'text',
          params: new HttpParams().set('id', id.toString()).set('stateUpd', stateUpd);
        });
        return this.http.request(req);
      }

edited Feb 01 '18 at 10:58

answered Feb 01 '18 at 08:57

Pierre Mallet

7,053
2
19
30

params is of type HttpParams, I'm getting a type error doing like that. – Logan Wlv Feb 01 '18 at 09:12
what is your angular version ? See https://stackoverflow.com/questions/45210406/angular-4-3-httpclient-set-params for the good way of adding HttpParams – Pierre Mallet Feb 01 '18 at 09:19
params: { id: id.toString(), stateUpd: stateUpd } – Logan Wlv Feb 01 '18 at 09:54
It should be like that but there is still a type error on id: id.toString() for some unknow reasons.. – Logan Wlv Feb 01 '18 at 09:55
Types of property 'params' are incompatible. Type '{ id: string; stateUpd: string; }' is not assignable to type 'HttpParams'. Object literal may only specify known properties, and 'id' does not exist in type 'HttpParams'. (method) Number.toString(radix?: number): string – Logan Wlv Feb 01 '18 at 10:23
and if I do as you said i got this : – Logan Wlv Feb 01 '18 at 10:25
Types of property 'params' are incompatible. Type '{ id: number; stateUpd: string; }' is not assignable to type 'HttpParams'. Object literal may only specify known properties, and 'id' does not exist in type 'HttpParams'. (property) id: number – Logan Wlv Feb 01 '18 at 10:25
I'm trying with new HttpParams().set(param1).set(param2) – Logan Wlv Feb 01 '18 at 10:29
this worked : const params = new HttpParams() .set('id', id.toString()) .set('stateUpd', stateUpd); – Logan Wlv Feb 01 '18 at 10:48
could you update your answer so I can validate it :) – Logan Wlv Feb 01 '18 at 10:48

Spring boot http POST @RequestParam multiple parameters

1 Answers1