如何使用 angular 获得响应 header

Question

分量：

下面是我调用服务中存在的 checkAuthentication() 函数的组件。

signIn() {
    this.loginService.checkAuthentication(this.login).subscribe(
      (resp) => {
        console.log(resp.headers);
        let user = resp.headers.get('info');
        localStorage.setItem('user', JSON.stringify(user));

        let token = resp.headers.get('x-token');
        localStorage.setItem('x-token', token);

        this.router.navigate(['/list']);
      },

      (error) => {
        this.login = new Login();
        console.log(error.error.message);
        Swal(error.error.message, 'Try again.', 'error');
      }
    );
  }

服务：

这是我的服务，我在这里呼叫休息 api。在休息时 api 我正在 header

constructor(private http:HttpClient) { }

  checkAuthentication(login): Observable<any> {
      let path = Constant.BASE_URL + 'api/login';
      const header = {
        headers : new HttpHeaders({
          'Content-Type': 'application/json'
        })
      };

      return this.http.post(path, login, header);
  }

下图是我在浏览器上得到的响应 header。

console.log(resp.headers); 正在显示 undefined

Answer 1

您需要过滤您的回复

constructor(private http:HttpClient) { }
    checkAuthentication(login): Observable<any> {
          let path = Constant.BASE_URL + 'api/login';
          const header = {
            headers : new HttpHeaders({
              'Content-Type': 'application/json'
            })
          };

          return this.http.post(path, login, header).map((res:Response)=> res);
      }

现在在订阅中，您对 header 和 body 也有完整的回复。现在你可以像

一样提取header

 signIn() {
    this.loginService.checkAuthentication(this.login).subscribe(
      (resp) => {
        console.log(resp.headers);
        let user = resp.headers.get('info');
        localStorage.setItem('user', JSON.stringify(user));

        let token = resp.headers.get('x-token');
        localStorage.setItem('x-token', token);

        this.router.navigate(['/list']);
      },

      (error) => {
        this.login = new Login();
        console.log(error.error.message);
        Swal(error.error.message, 'Try again.', 'error');
      }
    );
  }

Answer 2

我将我的服务更改为以下。通过结合@Biplab Malakar 的回答和@trichetriche 的评论。现在可以使用了

checkAuthentication(login: Login): Observable<any> {
    let path = Constant.BASE_URL + 'api/login';

    return this.http.post(path, login, {
      headers: new HttpHeaders()
        .set('Content-Type', 'application/json'),
      observe: 'response'
    }).map((res) => res);
  }

如何使用 angular 获得响应 header

How to get the response header using angular

response

httpclient

angular