Get status code http.get response angular2

Question

I need to get the status code of the following http call and return it as a string

//This method must return the status of the http response
confirmEmail(mailToken):Observable<String>{

     return this.http.get(this.baseUrl+"users/activate?mailToken="+mailToken)
                     .map(this.extractData)
                     .catch(this.handleError);

}

thx!

Solution 1

Adding answer for versions of Angular >= 4.3 (including 11) with new HttpClient that replaces http

import {HttpClientModule} from '@angular/common/http'; // Notice it is imported from @angular/common/http instead of @angular/http

How to get response code or any other header:

http.get(
   `${this.baseUrl}users/activate?mailToken=${mailToken}`,
    {observe: 'response'}
)
  .subscribe(response => {
    
    // You can access status:
    console.log(response.status);
    
    // Or any other header:
    console.log(response.headers.get('X-Custom-Header'));
  });

As noted in the comment by @Rbk,

The object {observe: 'response'} is what makes the full response object available.

Check Documentation

Solution 2

Just modify your code as following to store your responseStatus in a field :

responseStatus: number;

//This method must return the status of the http response
confirmEmail(mailToken):Observable<String> {
//Edited for working with HttpClient on Angular >= 4.3
  return this.http.get(this.baseUrl+"users/activate?mailToken="+mailToken, {observe: 'response'})
                 .map((response: Response) => {
                   this.responseStatus = response.status;
                   return this.extractData(response);
                 }
                 .catch(this.handleError);

}

And then display it in your component HTML template :

<p class='responseStatus'>{{responseStatus}}</p>

Solution 3

Its simple !!

Inside your extractData function

extractData (res){
//res.status  will be your status code
// res.statusText  will be your status Text
}

Comments

[Maurizio Rizzo]

Sorry for the inappropriate question, how should I add it to my code?

[G1P]

,write a method called in the service protected extractData(response: Response) { return response.statusText; }

[Maurizio Rizzo]

I already have a method with this name: private extractData(res: Response) {let body; try { body = res.json(); }catch (err){ alert(err.message); } return body || { }; }

[G1P]

so in your return call you are returning body which is the response object itself not just the statusText , caller can extract the statusText from it....I suppose you want to return the whole response not just the status text

[Maurizio Rizzo]

This way I can not interpret the response from the component

[Karbos 538]

It's not clear, if you want to call your extractMethod and then display the statusCode in your component, you could store this in a field. I edited my answer again.

[Rbk]

It must be made clear that to get the full http response object, the option {observe:'response'} is the deciding factor here and then you can return the full response accordingly.Without {observe:'response'},you won't get the full response,only the body data.

[hassan khademi]

just add {observe: 'response'} to header