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 } 
];

URL是：
本地环境
本地主机：4200
坐着
sit.company.com
UAT
uat.company.com
生产
company.com

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

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

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

login.component.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();
  }

  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);
        })
      );
  }

身份验证保护程序.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();
  }

  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);
        })
      );
  }

canActivate（路由：ActivatedRouteSnapshot，状态：RouterStateSnashot）：可观察{
返回此.authenticateService.isAuthenticatedWithBackend（）文件
.烟斗(
映射（用户=>{
const userDetails:userDetails={
userId:user.username，
用户名：user.uacUser.username
};
如果（用户详细信息）{
this.authenticateService.setCurrentUser（userDetails）；
返回true；
}否则{
this.router.navigate（['/login']）；
返回false；
}
}),
捕捉错误（e=>{
this.router.navigate（['/login']）；
归还（假）；
})
);
}

abc page.component.html

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

根页面

---

p、 我正在使用Angular 9

你能在这里添加更多关于登录组件、主页组件和authguard的详细信息吗？@Arunkumaramasamy，我在帖子中添加了代码片段。谢谢。@Angus this.router.navigate（['/']）将始终转到具有authguard重定向到login的主组件，但在login组件中，您有一个重定向回主组件（如果env是prod），您必须在那里检查用户是否经过身份验证。@laiju，但我不确定如何实现导航到应用程序的根目录（即：sit.company.com或uat.company.com或company.com）如果我没有使用这个.router.navigate（['/']）。@Angus你能更清楚地解释一下这个要求吗。为了访问网站（主页）的路径，用户需要进行身份验证，对吗？身份验证是在登录组件中完成的。我说得对吗？