angular - Angular OpenID：在浏览器中加载应用程序之前重定向到登录

Question

我正在使用 Angular 12 和angular-oauth2-oidc，到目前为止，我已经成功设置了身份验证。但是，就在被重定向到登录之前，正在加载应用程序（仅一瞬间，但仍然如此）。除非您已登录，否则有什么方法可以完全隐藏该应用程序？

Answer 1

如果您正在使用路由，那么您可以考虑使用警卫来防止在用户未经授权的情况下加载任何路由。守卫看起来像

class AuthenticatedGuard implements CanActivate {
  userLoggedIn = AuthService.isLoggedIn;
  canActivate() {
    if (this.userLoggedIn) {
     return true;
    } else {
     return false;
    }
  }
}

然后为了防止应用程序加载需要授权的路由，在路由模块中，您可以使用canActivate属性单独添加警卫，甚至将它们作为路由的子节点，以节省一些时间，如下所示：

{    
  path: '',
  component: AppComponent,
  canActivate: [AuthenticatedGuard],
  children: [
     { path: '', component: HomeComponent }, // Other routes here
  ]
}