Angular HttpModule如何处理从远程API接收的不适当的数据

Question

我正在像这样通过Angular从远程API获取数据：

this.http.get("https://example.com/getUsers").subscribe(users => {
  this.users = users.json();
});

在HTML组件中：

<ul>
  <li *ngFor="let x of users; let i = index">
    {{x.id}} {{x.body}}
  </li>
</ul>

现在，当数据按应有的结构进行构造-JSON编码文档的数组时，一切都很好。

但是，如果远程数据结构将从以下位置更改：

[
 {
   // some object
 }
]

至

"just a string"

该应用可能会由于两个错误而被关闭：

1. 收到的数据不再是有效的json格式。

2. ngFor将由于不是数组而引起。

如何解决呢？

Answer 1

在订阅中，您正在捕获onNext，但您也需要捕获onError：

this.http.get("https://example.com/getUsers").subscribe(
  users => {
    this.users = users.json();
  },
  error => {
    console.log(error);
    this.users = [];
  }
);

在这里，您可以了解有关订阅的更多详细信息。

顺便说一句，如果您的问题是在onNext中捕获了响应，而问题是“用户”不是数组，则可以在进行以下检查：

this.http.get("https://example.com/getUsers").subscribe(
  users => {
    // Check if users is an array, but you may check whatever you need.
    if (Array.isArray(users)) {
      this.users = users.json();
    } else {
      this.users = [];
    }
  },
  error => {
    console.log(error);
    this.users = [];
  }
);

您需要知道两个HTTP标头，首先是一个名为"Accept"的htpp请求标头，此标头指定您将接受的mimetype，例如，如果您将请求标头设置为"Accept: application/json"在执行http get之前，当后端接受请求并“完成工作”时，将设置一个名为"Content-Type"的http响应标头，该标头指定响应主体的模仿"Content-Type" 。 如果"Accept"请求标头与"Content-Type"响应标头不同，则OnError将捕获它。

可能您未指定Accept标头，因此无论mimetype是否具有响应主体，onNext都会捕获它。