Переадресация автоматически на страницу входа в Identity Server без нажатия кнопки входа - Angular 8

Question

Я пытаюсь выполнить автоматическое перенаправление с моего angular клиента, перейдя по этому пути http://localhost:4200/login к шаблону формы входа на сервер Identity без нажатия кнопки.

Теперь мне удается перейти страницу входа в систему на сервере идентификации, нажав кнопку login(), которая реализует эту функцию this.oidcSecurityService.authorize() из пакета angular-auth-oidc-client.

Итак, как я могу автоматически запустить эту функцию this.oidcSecurityService.authorize() после перехода к http://localhost:4200/login без нажатия кнопки login()?

Это мой login.component.html:

<h1>Login With Identity Server</h1>

<div class="card-container">
<mat-card class="card"> 
   <button *ngIf="!isAuthorized" mat-button type="submit" (click)="userlogin()"><mat-card-title>Login</mat-card-title></button>
   <button *ngIf="isAuthorized" mat-button type="submit" (click)="userlogout()"><mat-card-title>Logout</mat-card-title></button>
</mat-card>
</div>
</div>

Это мой login.component.ts:

export class LoginComponent implements OnInit {

  isAuthorizedSubscription: Subscription;
  isAuthorized: boolean;

  constructor(private authService: AuthService ) { }

  ngOnInit() {
    this.authService.initAuth();
    this.isAuthorizedSubscription = this.authService.getIsAuthorized().subscribe(
      (isAuthorized: boolean) => {
        this.isAuthorized = isAuthorized;
      });
  }

  public userlogin() {
      this.authService.login();
  }

  public userlogout() {
    this.authService.logout();
  }

}

Это мой auth-guard.service:

export class AuthGuardService implements CanActivate {

constructor(private router: Router,  private authService: AuthService) { }
  public canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | boolean {
    return this.authService.getIsAuthorized().pipe(map((isAuthorized: boolean) => {
        if (isAuthorized) {
            return true;
        }
        // Stores the attempted URL for redirecting.
        this.authService.setRedirectUrl(state.url);

        // Not signed in so redirects to unauthorized page.
        this.router.navigate(['/unauthorized']);
        return false;
    }));
  }
}

И это мои маршруты:

const routes: Routes = [
    {
      path: '', // this path should return the template login page of the Identity Server
      redirectTo: '/login',
      pathMatch: 'full',
    },
    {
      path: 'login',
      component: LoginComponent
    },
    {
     path: 'home',
     component: HomeComponent,
     canActivate: [AuthGuardService]
    },

Примечание: этот path: '' должен вернуть страницу входа в систему шаблона Identity Server после перенаправления на /login.

Answer 1

Мне удалось это решить! Просто изменив login.component.ts следующим образом:

 ngOnInit() {
    this.authService.initAuth();
    this.authService.login();
  }

Теперь он автоматически перенаправляется на страницу входа в систему сервера идентификации.

Спасибо ...

Answer 2

Итак, вы можете явно перенаправить на страницу.

  constructor(private authService: AuthService, private router: Router) { }

  ngOnInit() {
    this.authService.initAuth();
    this.isAuthorizedSubscription = this.authService.getIsAuthorized().subscribe(
      (isAuthorized: boolean) => {
        this.isAuthorized = isAuthorized;
        if (!isAuhorized) {
          this.router.navigate(['login']);
        }
      });
  }

Или явным образом вызовите метод входа AuthService ():

  constructor(private authService: AuthService ) { }

  ngOnInit() {
    this.authService.initAuth();
    this.isAuthorizedSubscription = this.authService.getIsAuthorized().subscribe(
      (isAuthorized: boolean) => {
        this.isAuthorized = isAuthorized;
        if (!isAuthorized) {
          this.authService.login();
        }
      });
  }