如何将 AWS Cognito 令牌添加到 Angular Http 拦截器

Question

我正在使用 AWS Cognito 和 Angular 8 为我的应用程序构建登录页面。一切正常，直到我尝试创建 getToken() 函数，事实证明 getSession() 方法接受 callback 而不是返回 string.

这意味着我必须将它包装在 Promise 中，如下所示：

export function getToken() {
  var currentUser = userPool.getCurrentUser();
  if (!currentUser) {
    // redirect to login page
  } else {
    return new Promise((resolve, reject) => {
      currentUser.getSession((err, session) => {
        if (err) {
          reject(err);
        } else if (!session.isValid()) {
          resolve(null);
        } else {
          resolve(session.getIdToken().getJwtToken());
        }
      });
    });
  }
}

这是我的 拦截器:

@Injectable()
export class AuthenInterceptor implements HttpInterceptor {

    intercept(req: HttpRequest<any>, next: HttpHandler) : Observable<HttpEvent<any>> {

        // Add token to the header.......

        return next.handle(req);
    }
}

据我所知，在这里返回 Promise 不是一个选项。那么如何将令牌添加到 header？或者我应该直接从 localStorage 获取它？

Answer 1

您可以在 intercept 函数中 return 一个 Observable。 return next.handle(req); 是 return 一个 Observable<HttpEvent<any>>。

您可以 return 来自 getToken() 的 Observable 和 from:

import { from } from 'rxjs';

export function getToken() {
  var currentUser = userPool.getCurrentUser();
  if (!currentUser) {
    // redirect to login page
  } else {
    return from(
      new Promise((resolve, reject) => {
        currentUser.getSession((err, session) => {
          if (err) {
            reject(err);
          } else if (!session.isValid()) {
            resolve(null);
          } else {
          resolve(session.getIdToken().getJwtToken());
          }
        });
      });
    );
  }
}

然后在 intercept 和 mergeMap 中使用它：

import { mergeMap } from 'rxjs/operators';

return getToken().pipe(
  mergeMap((token) =>
  {
    request = request.clone(
    {
        setHeaders : { ... }
    });

    return next.handle(request);
  })
)

如何将 AWS Cognito 令牌添加到 Angular Http 拦截器

How to add AWS Cognito token to the Angular Http Interceptor

promise

angular-http-interceptors

amazon-cognito

angular