angular5 - 根据 Angular5 中的有效令牌加载任何组件

Question

我在 localStorage 中有令牌，我想重定向每次尝试使用无效令牌加载任何组件。我该怎么做？可以使用onInit()功能，但我如何将它实现到每个组件？

标签： angular5

Answer 1

使用警卫：

@Injectable()
export class AuthGuard implements CanActivate {

    canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
        if (valid token) {
          return true
        } else { // invalid token, force to redirect
          this.router.navigate(['/redirectUrl']); 
          return false;
        }
      }
}

和路由：

....
    { path: 'myRoute', component: MyComponent, canActivate: [AuthGuard]},
...