Angular-oauth2-oidc: Can you add hasValidAccessToken$ stream?

Created on 6 Nov 2019  路  1Comment  路  Source: manfredsteyer/angular-oauth2-oidc

Sometimes I need the access token valid status in HTML. In such a case, I add a getter to class like this:

get hasValidAccessToken(): boolean {
  return this.oAuthService.hasValidAccessToken();
}

and I use this getter in the HTML as shown below:

<p *ngIf="hasValidAccessToken">Welcome</p>

It's okay but if you add a boolean observable, it will consume less resource.

If there is a observable like this:

hasValidAccessToken$  = new ReplaySubject(1);
this.hasValidAccesToken$.next(<false|true>);

We can use this observable in the HTML with async pipe

<p *ngIf="oAuthService.hasValidAccessToken$ |聽async">Welcome</p>
feature-request

Most helpful comment

Sounds like a reasonable request, To add my two cents: if we do go this way, it would be _highly confusing_ if we _only_ do hasValidAccessToken and not the other related methods.

On a side note, for those looking for a workaround, here's what I do in my applications:

@Injectable({ providedIn: 'root' })
export class AuthService {
  private isAuthenticatedSubject$ = new BehaviorSubject<boolean>(false);
  public isAuthenticated$ = this.isAuthenticatedSubject$.asObservable();

  constructor (
    private oauthService: OAuthService,
    private router: Router,
  ) {
    this.oauthService.events
      .subscribe(_ => {
        this.isAuthenticatedSubject$.next(this.oauthService.hasValidAccessToken());
      });
    // etc.
  }
}

And anywhere else in my application I rely on my _own_ AuthService instead of the library one, just to make sure my app is only tightly coupled to the specific OAuth library in _one_ place.

>All comments

Sounds like a reasonable request, To add my two cents: if we do go this way, it would be _highly confusing_ if we _only_ do hasValidAccessToken and not the other related methods.

On a side note, for those looking for a workaround, here's what I do in my applications:

@Injectable({ providedIn: 'root' })
export class AuthService {
  private isAuthenticatedSubject$ = new BehaviorSubject<boolean>(false);
  public isAuthenticated$ = this.isAuthenticatedSubject$.asObservable();

  constructor (
    private oauthService: OAuthService,
    private router: Router,
  ) {
    this.oauthService.events
      .subscribe(_ => {
        this.isAuthenticatedSubject$.next(this.oauthService.hasValidAccessToken());
      });
    // etc.
  }
}

And anywhere else in my application I rely on my _own_ AuthService instead of the library one, just to make sure my app is only tightly coupled to the specific OAuth library in _one_ place.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

godhar picture godhar  路  3Comments

prmces picture prmces  路  4Comments

PandaaAgency picture PandaaAgency  路  3Comments

zulander1 picture zulander1  路  4Comments

Swissbite picture Swissbite  路  4Comments