在 Angular 8 中的每个 ngOnInit 中（有条件地和隐式地）强制导航

Question

我的服务中有一个变量 token。目前，它决定我是否通过身份验证。当应用程序需要检查用户是否已登录时，它会询问应用程序 !!this.security.token 并做出相应的反应。这需要发生在每个安全组件中。

ngOnInit() {
  if (!this.security.token)
    this.router.navigate(["/login"]);
  ...
}

我想知道是否有更好的方法来处理这个问题。我正在比较添加 headers 并记录到我的 GET 和 POST 的 HTTP 拦截器，这非常方便。然而，谷歌搜索 interceptor angular router 只给出了 HTTP 注入的命中，与控制路由无关。

有没有办法拦截对每个组件的调用，检查 token 是否仍然存在？

export class SomeComponent implements OnInit {
  constructor(
    private security: SecurityService,
    private router: Router,
    private route: ActivatedRoute) { }

  id: string;

  ngOnInit() {
    if (!this.security.token)
      this.router.navigate(["/"]);

    this.route.params
      .subscribe(suc => this.id = suc.id);
  }
}

Answer 1

正如其他人之前提到的，Angular 提供 route guard 检查特定用户是否启用或未启用在该路线上导航。

您还可以在路线上实施自定义验证。

StackBlitz example

Random blog example

在 Angular 8 中的每个 ngOnInit 中（有条件地和隐式地）强制导航

Forcing a navigation in every ngOnInit (conditionally and implicitly) in Angular 8

router

typescript

angular