Need to get Header property value from HttpClient in Angular

Question

Need to get value from header. Need to get X-Count property value using angular. My code has some errors

Backend code

@GetMapping(produces = MediaType.APPLICATION_JSON_VALUE)
public ResponseEntity<List<OrderDTO>> getAllOrders(){
    HttpHeaders httpHeaders = new HttpHeaders();
    httpHeaders.add("X-Count",String.valueOf(orderService.ordersCount()));
    httpHeaders.setAccessControlAllowHeaders(Arrays.asList("X-Count"));
    httpHeaders.setAccessControlExposeHeaders(Arrays.asList("X-Count"));
    return new ResponseEntity<List<OrderDTO>>(orderService.getAllOrders(),httpHeaders,HttpStatus.OK);
}

Service directory

getOrderCount(): Observable<any> { return this.httpClient.get<any>(this.BASE_URL); }

Component directory

this.placeOrderService.getOrderCount().subscribe(count => {
  console.log(count.headers.get('X-Count'));
}, error1 => {
  console.log(error1);
});

nash11 · Accepted Answer · 2019-07-09 11:19:30Z

1

The response body doesn't return all the data you may need. Sometimes servers return special headers or status codes to indicate certain conditions that are important to the application workflow.

Tell HttpClient that you want the full response with the observe option

getOrderCount(): Observable<any> {
  return this.httpClient.get<any>(this.BASE_URL, { observe: 'response' });
}

Now HttpClient.get() returns an Observable of typed HttpResponse rather than just the JSON data.

(Source: docs)

answered Jul 9, 2019 at 11:19

nash11

8,7503 gold badges23 silver badges58 bronze badges

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

1 Comment

nash11 Over a year ago

If this answer helped you, kindly accept it as the right answer :) See here: stackoverflow.com/help/someone-answers

riorudo · Accepted Answer · 2019-07-09 11:23:33Z

0

You need also to observe the response like this:

getOrderCount() : Observable<HttpResponse<any>>{
    return this.http.get<HttpResponse<any>>(this.BASE_URL, {observe: 'response'}).pipe(
         tap(response=> console.log('headers', response.headers))
    );
}

answered Jul 9, 2019 at 11:23

riorudo

1,25711 silver badges20 bronze badges

1 Comment

Samantha de Silva Over a year ago

never use pipe method. normally use subscribe method in Observable class

Collectives™ on Stack Overflow

Need to get Header property value from HttpClient in Angular

2 Answers 2

1 Comment

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Related