在访问令牌到期时，让其他 API 在获取新的访问令牌之前等待

Question

我的要求是实现一个Http post方法函数，其中，

• 如果有 API 调用，它应该简单地执行它。
• 但是，如果访问令牌已过期并且有 API 调用，则应首先调用访问令牌 API。在它响应并获取新令牌之前，实际的 API 应该等待。

访问令牌过期时调用的 API 数量会有所不同。所以任何数量的 API 都应该排队。

注意： 访问令牌在客户端验证时被声明为“过期”。实际访问令牌过期时间将在服务器上设置。

如何做到这一点？一个简单的例子将不胜感激。提前谢谢你。

Answer 1

遇到了同样的问题。我按照这里的描述解决了它：https://www.intertech.com/Blog/angular-4-tutorial-handling-refresh-token-with-new-httpinterceptor/

Answer 2

请查找示例实现

 intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    this.sharedAPIProvider = this.inj.get(SharedAPIProvider);


    this.assetupdateArry = { users : 'getUserById' };
    return new Observable<HttpEvent<any>>((subscriber) => {

      // first try for the request
      next.handle(req)
        .timeout(API_TIMEOUT)
        .subscribe(
        (event: HttpEvent<any>) => {
          if (event instanceof HttpResponse) {
            // console.log('success from interceptr');
                  subscriber.next(event);
            subscriber.complete();
          }
        },
        (error) => {
          if (error instanceof HttpErrorResponse) {

            const requestUrl = this.checkUrl(error, sessionAvoidUrls); 
            if (requestUrl && error.status === 401) {
              console.log('401 error, trying to re-login');

              // If more then 10 retry cancel request
              if (this.loginApiRetry > RE_AUTH_COUNT) {
                this.loginApiRetry = 0;
                subscriber.error(error);
              } else {
                this.loginApiRetry = this.loginApiRetry + 1;
                this.resetLoginAPICount();
                // console.log(this.loginApiRetry);
                // try to re-log the user
                this.sharedAPIProvider.reLogin().then((loginResp: any) => {
                  // re-login successful -> create new headers with the new auth token
                  if (loginResp !== undefined) {
                    this.events.publish('loginuser:update', loginResp);
                    const authToken = loginResp.response.authToken;
                    const newRequest = req.clone({
                      headers: req.headers.set('Authorization', authToken),
                    });
                    this.storageProvider.set('authToken', authToken);

                    // retry the request with the new token
                    next.handle(newRequest)
                      .timeout(API_TIMEOUT)
                      .subscribe(
                      (newEvent) => {
                        if (newEvent instanceof HttpResponse) {
                          // the second try went well and we have valid response
                          // give response to user and complete the subscription
                          subscriber.next(newEvent);
                          subscriber.complete();
                        }
                      },
                      (newError) => {
                        // second try went wrong -> throw error to subscriber
                        subscriber.error(newError);
                      });
                  } else {
                    this.events.publish('user:relogin');
                  }
                });
              }
            }  else {
              subscriber.error(error);
            }
          } else {
            // the error was not related to auth token -> throw error to subscriber
            subscriber.error(error);
          }
        });
    });
  }