typescript - NestJS HttpService 调用多个端点

Question

我通常是一名 PHP 开发人员，几乎没有使用 javascript/typescript 的经验。刚开始使用 NestJS - 我想要一个端点，该端点返回一个 requisitions 列表，该列表是通过其端点从另一个系统检索到的。

粗略的思路:

1. 使用凭据调用登录端点
2. 使用来自登录端点的 token 调用请求列表端点
3. 返回结果

我尝试过像这样调用端点:

const url ='https://the-requisition-endpoint';
const config: AxiosRequestConfig = {
      headers: {
        'Accept': 'application/json',
        'Authorization': 'a_hard_coded_token_string' // hard coded for experimentation
      }
    };
let result = this.httpService.get(url, config);
result.subscribe(response =>
  console.log(response.data);
});

现在我需要更改它以便 token 不被硬编码 - 以使用来自登录端点的 token 。

我不确定如何强制仅在登录端点返回 token 后才调用申请端点。我搜索并发现 Promise.all() 或 a function called zip might help , 但我不知道如何让它发挥作用。

Answer 1

我相信您正在寻找的 RxJS 运算符是 switchMap .本质上，您最终会希望做这样的事情:

@Injcetable()
export class MyService {

  constructor(private readonly httpService: HttpService) {}

  getRequisitions(): Observable<any> {
    // change to POST signature is login is a post. post(url, body, config)
    return this.httpService.get(url, config).pipe(
      // optional, but it makes working with responses easier
      map(resp => resp.data),
      // make new http call and switch to this observable
      switchMap(loginData => this.httpService.get(url, configWithLoginData)),
      / again, optional, but useful for keeping data easily readable
      map(resp => resp.data),
      // optional, but useful for checking what is returned
      tap(data => console.log(data))
  }
}

好吧，这里发生了很多事情，所以让我们也分解一下。在 NestJS 中，内置的 HttpService 返回 Observables 而不是 Promises。这允许您做一些非常强大的事情，比如在出现某些故障时重试 HTTP 调用。这可以通过 promises 来完成，但它确实需要更多的代码。无论如何，在第一次 HTTP 调用之后的 .pipe 允许我们开始操作 RxJS 流并在数据通过时处理它。

map 是一个 RxJS 运算符，类似于 Array.prototype.map 运算符，因为它将转换函数应用于可观察对象发出的每个值(在本例中它只是一个值，但理论上它可以适用于许多值。

switchMap 是 RxJS 中的扁平化运算符之一，还有 mergeMap 和 concatMap。我会让您从与上面相同的链接中阅读那些内容，但本质上，switchMap 取消了当前的可观察对象以支持新创建的可观察对象，这有助于我们避免内存泄漏。我们返回一个新的 Observable(一个新的 HttpService 调用)，并开始处理该数据。

tap 是一个 spy 操作符，因为它不会对其有权访问的数据做任何事情，它只允许您查看它(通过 console.log)。这几乎是它的用途，但如果需要并且响应无关紧要，您可以进行其他标注。

最后，没有 subscribe 因为 NestJS 会在后台订阅并发送最后发出的值作为响应。无需我们自己担心。

哦，所有 map(resp => resp.data) 的响应是 AxiosResponse 有几个字段，但在大多数情况下，您可能只关心返回data 属性中保存的数据。

每个 RxJS 运算符都接受一个函数，在这里我们只是在每种情况下使用一行函数。如果需要，您可以使用完整的匿名函数语法。即

map((resp) => {
  return resp.data;
})

一行语法只是更短，但如果必须执行不适合一行的额外逻辑，则需要重写。