Angular 4 / Express中的访问响应状态代码答案

【问题标题】：Access Response Status Code in Angular 4 / ExpressAngular 4 / Express中的访问响应状态代码
【发布时间】：2017-10-31 12:14:16
【问题描述】：

我正在向 Express REST API 发出 GET 请求，并在将 res.status 设置为 200 后返回数据。在 Angular 中，响应包含数据，但 response.status 始终未定义。

[编辑开始]

根据下面 Martin Adámek 的回答，我尝试更改我的 get 请求以使用 Observable 而不是 Promise，并在请求中包含 { observe: 'response' }。但响应完全相同 - 仍然没有 response.status。

Angular 4 获取（带有 Observable）

requestNew(endPoint:string, type:string, query:string, data:any) {
  this.http[type](this.configService.apiHost + endPoint + query, data ? data : '', { observe: 'response' })
    .subscribe(
      (response:HttpResponse<any>) => {
        console.log(response) // Array containing expected data
        console.log(response.status) // undefined
      }
    )
}

[编辑结束]

Angular 4 获取

import { HttpClient, HttpResponse, HttpErrorResponse } from '@angular/common/http';

request(endPoint:string, type:string, query:string, data:any) {
  let promise = new Promise((resolve, reject) => {
    this.http[type](this.configService.apiHost + endPoint + query, data ? data : '')
      .toPromise()
      .then((response: HttpResponse<any>) => {
        resolve(response);
      })
      .catch((error: HttpErrorResponse) => {
      })
  });
  return promise;
}

Express API：

router.get('/clients', (req, res) => {
  clientService.GetClients()
    .then((data) => {
      res.status(204).json(data); // data is sent
    })
})

如何在 Angular 4 中访问 response.status？

【问题讨论】：

你能告诉我们你是如何检查你的状态的吗？一些日志？
我看到你尝试了我的答案。下次通过 cmets ping 我，所以我知道出了点问题：] 我认为问题在于您将 {observe: 'response'} 作为第三个参数传递，但对于 get，它应该是第二个参数，因为没有 payload .
顺便说一句，这与可观察/承诺无关，如果您愿意，请随时遵守承诺。重要的部分是添加此选项，这样您将获得整个响应，而不仅仅是body。

标签： angular rest http express

【解决方案1】：

HttpClient 会自动将负载从 JSON 转换并传递给您。如果你想访问整个响应对象，你可以这样做：

http
  .get('/data.json', {observe: 'response'})
  .subscribe(resp => {
    console.log(resp.status);
  });

https://angular.io/guide/http#reading-the-full-response

https://angular.io/api/common/http/HttpResponse

还要注意GET 和DELETE 方法与POST 和PUT 具有不同的签名，没有有效负载参数，因此您需要将{observe: 'response'} 作为这些方法的第二个参数传递。

【讨论】：