如何在Angular 2中检测HTTP状态码

Question

我在我的Angular2项目中有一个loadSize()函数，它调用了我的服务中的getTotalNumberCampaigns()函数并返回一个observable。我订阅这个observable以获取结果。

这是我的loadSize()函数：

   loadSize() {
    this.campaignsService.getTotalNumberCampaigns().subscribe(value => {//async call
        this.campaignSize = value;
    }, (err)=> {}

    );
}

假设我的getTotalNumberCampaigns()出现错误，会触发subscribe中的err=>{}。我的问题是我如何知道http响应状态码，以便我可以指导用户采取不同的操作（如果是连接失败（502），用户应该刷新。如果是access_token到期（500），页面应该跳转到登录页面）

这是我的服务类中的getTotalNumberCampaigns()

 getTotalNumberCampaigns(): Observable<number> {
    return this.http.get(`${this.apiUrl}/Count`, { headers: this.headers })
        .map<number>(res => <number>res.json())
}

- Bob Zhang

---

应该检查 err.status，可参考 Angular 响应文档。 - Abdulrahman Alsoghayer

不，您不需要更改可观察类型。可观察类型不会改变。 - Abdulrahman Alsoghayer

你可以将错误回调函数更改为：(err:any) => console.log(err.status) - Abdulrahman Alsoghayer

你图片中的错误是由于在你的get请求之前发出的预检请求（option请求）引起的。因此，它不是由http.get()返回的同一可观察对象抛出的。这是一个CORS相关的错误，不是(access_token)错误。你应该在你的服务器上添加头部：(Access-Control-Allow-Origin: *)。 - Abdulrahman Alsoghayer

这个：https://dev59.com/olsX5IYBdhLWcg3wU-NM#33942337 帮助了我，你可能考虑看一下。 - Floris

Answer 1

返回的错误对应于响应本身，因此您可以使用它的状态属性获取状态代码：

loadSize() {
    this.campaignsService.getTotalNumberCampaigns().subscribe(value => {//async call
        this.campaignSize = value;
    }, (err: any) => { console.log(err.status); console.log(err);}

    );
}

- Thierry Templier

---

奇怪的，你之前在数据流中使用过catch操作符吗？当出现错误时，响应对象会被提供。但你可以自由地使用这个操作符来捕捉它，并使用Objectable.throw来抛出另一个。这是你的情况吗？ - Thierry Templier

我将开始一个新的问题，因为对于这个主题，问题已经解决了。 - Bob Zhang

http://stackoverflow.com/questions/35718175/why-my-error-in-subscirbe-err-here-is-different-from-the-error-in-bro - Bob Zhang

Answer 2

在你的loadSize方法中

loadSize() {
    this.campaignsService.getTotalNumberCampaigns().subscribe(value => {//async call
        this.campaignSize = value;
    }, (err)=> {}

    );
}

你应该通过代码获取响应码

value.status

- Rambou