在重定向之前，AngularFire 4月份为我的平台令牌交换FireBase令牌

Question

我使用AngularFire来为Firebase auth用户池提供方便，并且身份验证工作正常。

但是，在Firebase auth之后，在从登录页面重定向到我的一个受保护的JWT应用程序页面之前，我需要将Firebase令牌从我的平台上转换为一个JWT令牌。

我认为这样做的方法是实现在路由器保护中调用我的平台令牌API的逻辑。

但是，当我这样做时，我会得到以下错误：

TypeError: source.lift不是一个函数

这是我的app-routing.module.ts，如果我将switchMap替换为map并删除async/await (不要让它返回承诺或在回调中执行异步逻辑)，事情就会很好--但是我不会调用API。

import { NgModule, Injector } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { canActivate, redirectUnauthorizedTo, redirectLoggedInTo } from '@angular/fire/auth-guard';
import { switchMap } from 'rxjs/operators';
import * as firebase from 'firebase';

import { LoginComponent } from './login/login.component';
import { InvestconfigComponent } from './investconfig/investconfig.component';
import { setWebIdentityCredentials } from './shared/auth.service';

//THIS IS THE IMPORTANT method
const redirectLoggedInAferSetAwsCreds = switchMap(async (user: firebase.User) => {
  // Call off to my backend to exchange FBase token for platform token..
  await setWebIdentityCredentials(user);
  return user ? ['config'] : true;
});
const redirectUnauthorizedToLogin = redirectUnauthorizedTo(['login']);

const routes: Routes = [
  { path: '', redirectTo: '/config', pathMatch: 'full' },
  { path: 'login', component: LoginComponent, ...canActivate(redirectLoggedInAferSetAwsCreds) },
  { path: 'config', component: InvestconfigComponent, ...canActivate(redirectUnauthorizedToLogin) },
  { path: '**', redirectTo: '/config' },
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

为什么这个不行？有更好的办法解决我的问题吗？

Answer 1

我让它起作用了，但我完全不明白当AngularFire的警卫被叫来时。海事组织，你不应该大声叫喊，让你的通行证在你的警卫。

如果你需要等待一个承诺，这里有一个有效的守卫：

const guardAndSetAwsCreds = pipe(
  tap(async (user: firebase.User) => {
    await setWebIdentityCredentials(user);
  }),
  map((user: firebase.User) => {
    return user ? true : ['login'];
  }),
);

tap()不会产生副作用，并将原始obj (在本例中为user)传递给map()。

我有一种错误的印象，即当AuthFire auth方法成功完成时，通过订阅调用AuthFire保护。情况并非如此。下面是一个AuthFire auth method的例子

this.afAuth.auth.signInWithEmailLink(email, window.location.href)

因为我不再有计时问题，所以我只需要在登录方法中获得一个平台令牌：

  async signinWithEmailLink() {
    // Confirm the link is a sign-in with email link.
    if (this.afAuth.auth.isSignInWithEmailLink(window.location.href)) {
      // Additional state parameters can also be passed via URL.
      // This can be used to continue the user's intended action before triggering
      // the sign-in operation.
      // Get the email if available. This should be available if the user completes
      // the flow on the same device where they started it.
      let email = window.localStorage.getItem('emailForSignIn');
      if (!email) {
        // User opened the link on a different device. To prevent session fixation
        // attacks, ask the user to provide the associated email again. For example:
        email = window.prompt('Please provide your email for confirmation');
      }

      // The client SDK will parse the code from the link for you.
      const res = await this.afAuth.auth.signInWithEmailLink(email, window.location.href)

      window.localStorage.removeItem('emailForSignIn');

      if (res.additionalUserInfo.isNewUser) {
        //User does NOT already exist in system (added by admin) might be sign-up from random dude from internet
        throw new Error('An admin must add you first');
      }

      await setWebIdentityCredentials(res.user);
    }
  }

我的路线警卫现在非常简单：

const routes: Routes = [
  { path: '', redirectTo: '/config', pathMatch: 'full' },
  { path: 'login', component: LoginComponent, ...canActivate(redirectLoggedInTo(['config'])) },
  { path: 'config', component: InvestconfigComponent, ...canActivate(redirectUnauthorizedTo(['login'])) },
  { path: '**', redirectTo: '/config' },
];