时间戳

首页 > 解决方案 > 到服务器根目录的 Angular 路由

angular - 到服务器根目录的 Angular 路由

问题描述

我的应用程序具有以下路由配置：

const rootRoutes: Routes = [
  { path: '', redirectTo: '/home', pathMatch: 'full' },
  { path: 'login', component: LoginComponent },
  { path: 'home', component: HomeComponent, canActivate: [AuthenticationGuard] },    // if unauthenticated, goes to LoginComponent
  { path: '**', component: PageNotFoundComponent } 
];

网址是：
local env
localhost:4200
SIT
sit.company.com
UAT
uat.company.com
PRODUCTION
company.com

我的应用程序具有使用 IBM WebSEAL 的单点登录 (SSO) 功能，因此当用户首次访问 sat.company.com 或 uat.company.com 或 company.com 时，他将被重定向到我们其他团队提供的登录页面以进行身份​​验证.

在我的本地环境中，由于没有实现此类 SSO 功能，因此用户将被重定向到 LoginComponent 进行身份验证。

我的问题是我有两个地方尝试路由到服务器的 SSO 页面，如下所示。但是，它只能返回 LoginComponent，而永远无法返回 sat.company.com 或 uat.company.com 或 company.com 的 SSO 页面。如何解决？

登录组件.ts

ngOnInit() {
    if (environment.production) {
      this.router.navigate(['/']);  // route to server's root page for SSO login
    }
}

  onSignIn() {
    if (!isNullOrUndefined(this.username)) {
      this.loginSub = this.authenticateService.login(this.username)
        .subscribe(user => {
          this.router.navigate(['/home']);
        });
    }
  }

  onSignOut() {
    this.authenticateService.logout();
  }

身份验证-guard.ts

  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> {
    return this.authenticateService.isAuthenticatedWithBackend()
      .pipe(
        map(user => {
          const userDetails: UserDetails = {
            userId: user.username,
            username: user.uacUser.userName
          };

          if (userDetails) {
            this.authenticateService.setCurrentUser(userDetails);
            return true;
          } else {
            this.router.navigate(['/login']);
            return false;
          }
        }),
        catchError(e => {
          this.router.navigate(['/login']);
          return of(false);
        })
      );
  }

abc-page.component.html

  <a class="nav-link" [routerLink]="'/'">root page</a>

ps 我正在使用 Angular 9

标签： angularroutessingle-sign-on

解决方案

推荐阅读