RxJS：在调用 S3 List 之前检查令牌的有效性，并等待令牌以防它无效

Question

请多多包涵，因为这个问题又长又详细，而且我对 RxJS 还很陌生。

我正在尝试在 Angular 中创建类似于 Windows Explorer 的 Amazon S3 浏览器。

Something like this...

左侧列表将包含所有根文件夹（它不会是树形视图），当单击任何根文件夹时，其中的子文件夹和文件将显示在右侧的详细信息视图中。

我需要为左侧列表中的每个根文件夹创建一个新的 S3 访问令牌。我有一个这样做的后端服务。此令牌在特定时间段内有效。所以当前token无效的情况有：-

1. 如果用户单击左侧列表中的某个其他根文件夹。
2. 如果令牌到期。

这是我为管理此令牌到期条件而编写的内容：-

private accessTokenSource: BehaviorSubject<AccessToken | null> = new BehaviorSubject(null);
accessToken$ = this.accessTokenSource.asObservable();

getAccessToken() {
    return this.http.get(${this.accessTokenEndpoint}).pipe(
        tap((accessToken) => {
            // set Access token in a subject
            this.accessTokenSource.next(accessToken);
        }),
        switchMapTo(timer(55*60*1000).pipe(
            tap(() => {
                // reset access token in subject since now token is invalid - Expiry case
                this.accessTokenSource.next(null);
            })
        ))
    );
}

// Whoever subscribes to this will fetch the token and start the expiration timer

由于不想在视图层中公开访问令牌获取逻辑，我的每个左列表和详细信息组件都调用了 s3Service 中的方法 getDetails(currentPrefix: string)。该方法首先检查令牌的有效性是否能够调用 S3 API，然后调用listObjects 操作并返回结果。这是我到目前为止所拥有的：-

// Checks the validity of token for the current prefix
checkAccessTokenValidity(currentPrefix: string) {
    let isTokenValid: boolean = true;

    // This uses access token set in the subject
    // According to me, it will be reset by the timer's tap operation (when it expires)
    const sub = this.accessToken$.subscribe((token) => {
        // Check token's expiry or usability for current folder and update isTokenValid accordingly
        if(!token || !currentPrefix.includes(token.rootFolder)) {
            isTokenValid = false;
        }
    });
    sub.unsubscribe();

    return isTokenValid;
}


// Public method to call from list and details components
getDetails(currentPrefix: string) {
    const isTokenValid = this.checkAccessTokenValidity(currentPrefix);
    if(!isTokenValid) {
        // This will fetch the token and start the TIMER
        this.getAccessToken().subscribe(() => {});
    }
    // I think that this will not work, since if getAccessToken takes time,
    // then accessToken$ will still be invalid!
    const objectList$ = this.accessToken$.pipe(
        map(token => {
            // S3 List Objects method here, with current token
        })
    )
}

如何解决检查令牌有效性然后等待我的服务返回新的有效令牌以调用 S3 API 的问题？任何帮助将非常感激。这种方法也可能是完全错误的，所以也请随时纠正我。

Answer 1

我想说没有必要仅仅为了获取BehaviorSubject 的当前值而创建另一个订阅。

这意味着这些行：

const sub = this.accessToken$.subscribe((token) => {
      if(!token || !currentPrefix.includes(token.rootFolder)) {
        isTokenValid = false;
      }
    });
sub.unsubscribe();

可以替换为

const isTokenValid = !!this.accessTokenSource.value;

正如您已经提到的，getAccessToken 需要一些时间，这意味着您无法同步获得其结果。

一个快速的解决办法是这样的：

const tokenValid$ = of(this.accessTokenSource.value); 

const tokenInvalid$ = merge(
  // Not interested in the values emitted as side effects are produced in `tap()`
  // With this, we're just subscribing. This way, an HTTP call will be made
  this.getAccessToken().pipe(ignoreElements()),

  // `accessTokenSource` is a `BehaviorSubject` and we don't want its current value,
  // that's why we're skipping it. Next time it emits, it will have the value returned from `getAccessToken`
  this.accessTokenSource.pipe(skip(1))
);

const objectList$ = iif(() => isTokenValid, tokenValid$, tokenInvalid$);

iff() 用于在订阅时间决定订阅哪个 observable。

if(() => booleanValue, subscribeToThisIfTrue, subscribeToThisIfFalse)

这样，当您订阅 objectList$ 时，它会根据令牌是否有效获取适当的 observable。