javascript - 使用 Typescript Angular 中的接口(interface)检查 API 响应数据

Question

我有一个应用程序，当用户登录时，他会收到一些数据作为响应，但如果响应不是我所期望的，应用程序就会崩溃。

让我向您展示以下内容:

我创建了一个接口(interface)来告诉 Typescript 我期望的数据。

export interface AuthResponseData {
  token: string;
  expires: string;
  role: number;
}

然后我创建了一个方法来将登录数据发送到服务器。

login(user: string, password: string){
  return this.http.post<AuthResponseData>(
    'https://localhost:44344/api/auth', { user: user, pwd: password }
  ).pipe(
    catchError(this.handleError),
    tap(resData => { this.handleAuthentication(resData.token, resData.expires, resData.role)})
  );
}

我期望如果服务器的响应与接口(interface)不匹配，那么 Angular 将重定向到 catchError。但没有发生。

现在我的问题是:有没有办法检查 API 响应是否等于接口(interface)，如果不等于则抛出错误。或者我问的是不可能的？

更新:

搜索后我发现接口(interface)在运行时消失，因此无法将 api 响应与接口(interface)进行比较(据我所知)。但我一直在寻找一种以动态方式检查 api 响应的方法。我认为依赖 api 响应总是正确的并不真正安全。所以我应该检查 API 响应。我怎样才能做到这一点？

希望你能帮助我，谢谢:)

Answer 1

正如您已经注意到的，interface纯粹是 TypeScript，它不存在于 JavaScript 中，也不会以任何方式模拟(就像 private 、 protected 、 public 和其他一些东西)。 TypeScript 中的类型检查只允许具有“快速失败”逻辑(您不必运行应用程序来注意到您自己的代码或第三方库被滥用，它在编译时失败)。

你的 Angular 应用程序只是一个 UI，不涉及任何关键操作(它们应该存在于你的后端)，所以我认为由于类型不匹配而引发错误不是一个好主意，而不是仅仅尝试尽可能地满足用户。根据我的说法，后端应该验证客户端输入，并且客户端应该尝试适应后端服务。

话虽这么说，这里有一个 JSON 验证草案 https://json-schema.org/一些库实现了它(例如: https://github.com/epoberezkin/ajv )。这将使您获得所需的行为。