如何在 Angular 中将 async/await 方法编写为 Observable？

Question

我曾经做过 async/await 并且刚刚学会了在 Angular 中使用 Observable 因为它是 Angular 方式，所以我想在这里重构这个代码片段，使它成为一个可观察：

async refreshToken() {
    const headers = this.authStorage.getRequestHeader();
    const body = {
      refreshToken: this.authStorage.getStoredValue('refreshToken'),
    };
    const newAccessToken = await this.http
      .post<any>(ApiURLStore.REFRESH_TOKEN_URL, body, { headers: headers })
      .toPromise();

    this.authStorage.setValueToStore('accessToken', newAccessToken);
  }

所以基本上我正在向我的后端发出 post 请求并取回令牌，然后在 authStorage 中使用它。

我试着把它作为一个 Observable 来做，到目前为止得到了这个：

refreshToken(): Observable<any> {
    const headers = this.authStorage.getRequestHeader();
    const body = {
      refreshToken: this.authStorage.getStoredValue('refreshToken'),
    };
    return this.http
      .post<any>(ApiURLStore.REFRESH_TOKEN_URL, body, { headers: headers });

    this.authStorage.setValueToStore('accessToken', newAccessToken);
  }

这没问题并且可以工作，但我不能以这种方式调用我的 authStorage。我无法将它保存在变量中，因为 Observable 需要有一个 return... 我也尝试过管道和订阅，但没有机会。

有什么建议吗？

Answer 1

您可以在 tap 运算符中执行副作用逻辑：

return this.http
    .post<any>(ApiURLStore.REFRESH_TOKEN_URL, body, { headers: headers })
    .pipe(
        tap(newAccessToken => this.authStorage.setValueToStore('accessToken', newAccessToken))
    );

如何在 Angular 中将 async/await 方法编写为 Observable？

How to write an async/await method as an Observable in Angular?

javascript

promise

observable

typescript

angular