Lire les en-têtes de réponse à partir de la réponse API - Angular 5 + TypeScript

Question

Je déclenche un HTTP et j'obtiens une réponse valide de sa part. La réponse contient également un en-tête X-Token que je souhaite lire. J'essaie d'utiliser le code ci-dessous pour lire les en-têtes, mais j'obtiens null comme résultat.

this.currentlyExecuting.request = this.http.request(reqParams.type, reqParams.url, {
    body: reqParams.body,
    responseType: 'json',
    observe: 'response'
}).subscribe(
    (_response: any) => {
        // Also tried _response.headers.init();
        const header = _response.headers.get('X-Token');
        console.log(header);
        onComplete(_response.body);
     },
    _error => {
        onComplete({
            code: -1,
            message: Constants.WEBSERVICE_INTERNET_NOT_CONNNECTED
        });
    }
);

La réponse de l API lorsqu'il est vérifié dans Chrome inspect, l'en-tête est présent.

Answer 1

Vous pouvez obtenir les en-têtes en utilisant le code suivant

let main_headers = {}
this.http.post(url,
  {email: this.username, password: this.password},
  {'headers' : new HttpHeaders ({'Content-Type' : 'application/json'}), 'responseType': 'text', observe:'response'})
  .subscribe(response => {
    const keys = response.headers.keys();
    let headers = keys.map(key => {
      `${key}: ${response.headers.get(key)}`
        main_headers[key] = response.headers.get(key)
       }
      );
  });

plus tard, nous pouvons obtenir l'en-tête requis à partir de l'objet json.

header_list['X-Token']

Answer 2

Angular 7 Service :

    this.http.post(environment.urlRest + '/my-operation',body, { headers: headers, observe: 'response'});
    Composant :        this.myService.myfunction().subscribe(
          (res: HttpResponse) => {
              console.log(res.headers.get('x-token'));
                }  ,
        error =>{
        })

Answer 3

Essayez ce code simple.

1. Code côté composants : pour obtenir les propriétés du corps et de l'en-tête. Ici, il y a un jeton dans body et Authorization dans l'en-tête.

loginUser() {
    this.userService.loginTest(this.loginCred).
    subscribe(res => {
        let output1 = res;
        console.log(output1.body.token);
        console.log(output1.headers.get('Authorization'));
    })
}

2. Code côté service : en envoyant les données de connexion dans le corps du message et en observant la réponse en Observable tous ceux qui sont souscrits du côté du composant.

loginTest(loginCred: LoginParams): Observable<any> {
    const header1= {'Content-Type':'application/json',};
    const body =  JSON.stringify(loginCred);
    return this.http.post<any>(this.baseURL+'signin',body,{
        headers: header1,
        observe: 'response',
        responseType: 'json'
    });
}