如何在没有 AngularFire 库的情况下从 Angular 拦截器发送 firebase IDToken？答案

【问题标题】：How to send firebase IDToken from Angular Interceptor without AngularFire library?如何在没有 AngularFire 库的情况下从 Angular 拦截器发送 firebase IDToken？
【发布时间】：2020-06-20 10:38:55
【问题描述】：

我想通过我的 Angular 应用程序的每个 http 请求发送 Firebase IDToken。到目前为止，我正在使用 AngularFire 库，并且拦截器正在按预期工作。我想删除 AngularFire 库，只想使用 Firebase。我怎样才能达到相同的结果？以下是我目前的实现：

@Injectable({
  providedIn: 'root'
})
export class RequestInterceptor implements HttpInterceptor {
  constructor(private af: AngularFireAuth) {}
  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    return this.af.idToken.pipe(
      mergeMap((token: string) => {
        if(!req.url.includes('auth')) {
          req = req.clone({
            setHeaders: {
              Authorization: `Bearer ${token}`
            }
          });
        }
        return next.handle(req);

      })
    );
  }
}

有没有办法可以使用普通的 firebase 库来实现相同的功能？

【问题讨论】：

标签： angular firebase-authentication

【解决方案1】：

我想我已经找到了解决这个问题的方法。但是，我不能 100% 确定它是否是最佳解决方案。如果你们可以查看以下代码，我将不胜感激：

@Injectable({
  providedIn: 'root'
})
export class ReqInterceptorService implements HttpInterceptor {
  constructor() {}
  /*
  * Every outgoing Http request will go through this Http interceptor and append
  * Authorization nav-header to it.
  */
  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    /* Firebase will refresh token automatically if expired */
    return from(this.getCurrentIdToken()).pipe(
      mergeMap(token => {
        console.log(token);
        req = req.clone({
          setHeaders: {
            Authorization: `Bearer ${token}`
          }
        });
        return next.handle(req);
      })
    )
  }

  getCurrentIdToken() {
    return new Promise((resolve, reject) => {
      const auth = firebase.auth();
      const unsubscribe = auth.onIdTokenChanged(user => {
        unsubscribe();
        if (user) {
          user.getIdToken().then(token => {
            resolve(token);
          });
        } else {
          reject(null);
        }
      }, reject);
    });
  }
}

【讨论】：