Angular ngrx + Firebase OAuth操作被调用但效果不是

时间:2018-05-26 19:24:52

标签: angular firebase-authentication observable ngrx ngrx-effects

我的oauth设置存在问题,当我以此效果退出时:

@Effect()
  logout:  Observable<Action> = this.actions.ofType(UserActions.LOGOUT)
    .switchMap(() => Observable.of(this.afAuth.auth.signOut()))
    .map(() => new UserActions.GetUser())
    .catch(err => Observable.of(new UserActions.AuthError({error: err.message})));

一切正常,UserActions.GetUser()正在调用。现在,如果我尝试使用此效果和此firebase auth函数登录:

@Effect()
  googleLogin: Observable<Action> = this.actions.ofType(UserActions.GOOGLE_LOGIN)
    .switchMap(() => Observable.fromPromise(this.loginWithGoogle()))
    .map(() => new UserActions.GetUser())
    .catch(err => Observable.of(new UserActions.AuthError({error: err.message})));

private loginWithGoogle() {
  return this.afAuth.auth.signInWithPopup(new firebase.auth.GoogleAuthProvider());
}

调用了新的UserActions.GetUser(),我可以在Redux DevTools中看到它,但实际的效果没有被调用,我在那里放了很多console.log,看我是不是做了些什么功能有问题,但根本没有被调用,catch也有GetUser,但也没有触发。

在这种情况下是否存在firebase问题或者我是愚蠢的?

操作:

Dispatched Actions

获取用户效果:

@Effect()
  getUser: Observable<Action> = this.actions.ofType(UserActions.GET_USER)
    .switchMap(() => {
      console.log('test'); // <-- Not called
      return this.afAuth.authState;
    })
    .map(()=> {
      return new UserActions.Authenticated();
    });

** 编辑1

我做了一个新观察:当没有互联网连接时,所以firebase从本地加载,它实际上有效,不知何故连接到firebase数据库存在问题

3 个答案:

答案 0 :(得分:0)

尝试使用这个:

@Effect()
googleLogin: Observable<Action> = this.actions.pipe(

        ofType(UserActions.GOOGLE_LOGIN),
        map(action => action.payload), // if there is no payload disregard this
        exhaustMap((auth: any) => Observable.fromPromise(this.loginWithGoogle()
               .pipe(
                  map(() => new UserActions.GetUser()),
                  catchError(err => Observable.of(new UserActions.AuthError({error: err.message})))
            ))
        )

    )

这对于exhaustMap和switchMap之间的一点区别。 如果你成功的话,请告诉我。

答案 1 :(得分:0)

你可以试试这个吗?在我看来这可能有所帮助。

  @Effect()
  googleLogin = this.actions.ofType(UserAction.GOOGLE_LOGIN).pipe(
    map(() => Observable.fromPromise(this.loginWithGoogle()),
    mergeMap(()=> return[{type: UserActions.GET_USER}])
  );

答案 2 :(得分:0)

我遇到了类似的问题,我认为效果没有被调用,因为在你的getUser效果中你没有实现catch阻止如果效果会引发任何错误,所以理想情况下在这种情况下如果效果会出错,并且没有任何捕获机制,效果不会为进一步的操作调用。