CODEWITHSUNDEEP
javascriptangulartypescriptngrxngrx-effects
youqing huang
youqing huang

Reputation: 21

Error: Effect dispatched an invalid action: undefined

I am trying to write an effect for my action. It has 2 service methods: getData() and checkToken() inside.

It will throw an error:

"ERROR Error: Effect "IndexEffects.loginStatusValidate$" dispatched an invalid action: undefined"

What should I do ?

 @Effect()
  loginStatusValidate$: Observable<Action> = this.actions$.pipe(
    ofType(IndexActionTypes.LoginStatusValidate),
    switchMap(() =>
      this.authService.getData().pipe(
        map(oldToken => {
          if (oldToken) {
            console.log("oldToken exsits");
            this.authService.checkToken().subscribe((newToken) => {
              console.log(newToken);
              // Throw error if I try to dispatch action here
              return new LoginStatusValidateSuccess(newToken);
            });
             // It's fine if I just dispatch action here
             //return new LoginStatusValidateSuccess('');

          } else {
            return new LoginStatusValidateError();
          }
        })
      )
    )
  );


 getData() {
    return of(localStorage.getItem('ACCESS_TOKEN'));
  }

 checkToken(){
      // access api refresh token 
      return of("newToken");

  }

Upvotes: 2

Views: 1644

Answers (1)

timdeschryver
timdeschryver

Reputation: 15505

The problem is this.authService.checkToken().subscribe((newToken) => {, by doing this you're not returning something, you're returning undefined.

You're subscribe, instead you must return a stream of actions, like you do with this.authService.getData().pipe.

Upvotes: 1

Related Questions