angular - Angular2 Authguard登录路径

Question

如果用户没有登录，想要进入一些安全的根目录，例如“/items” authguard 返回 false 并且不要导航“/login”。

export const APP_ROUTES: Routes = [
  {path: '', component: PublicComponent, children: PUBLIC_ROUTES},
  {
    path: '',
    component: SecureComponent,
    resolve: {user: UserResolver},
    canActivate: [AuthGuard],
    children: SECURE_ROUTES
  },
  {path: '', redirectTo: '/login', pathMatch: 'full'}
];

AuthGuard 代码：

@Injectable()
export class AuthGuard implements CanActivate {
  constructor(private userService: UserService) {}

  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot){
    let url: string = state.url;
    return this.checkLogin(url);
  }

  checkLogin(url: string): Observable<boolean> {
    this.userService.redirectUrl = url;
    return this.userService.getPrincipal()
      .map(user => {
        if(user)
          return true;

        return false;
      });
  }
}

Answer 1

Router如果用户未登录，则注入，并重定向到登录页面，如下所示：

@Injectable()
export class AuthGuard implements CanActivate {

  constructor(private userService: UserService, private router: Router) {}

  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean{
    let url: string = state.url;
    return this.checkLogin(url);
  }

  checkLogin(url: string): Observable<boolean> {
    this.userService.redirectUrl = url;
    return this.userService.getPrincipal()
      .map(user => {
        if(user)
          return true;

        this.router.navigate(['login']);
        return false;
      });
  }
}