时间戳

首页 > 解决方案 > 如何与重定向共享令牌验证功能？

angular - 如何与重定向共享令牌验证功能？

问题描述

我正在尝试保护我的页面，以确保用户只有在经过身份验证后才能访问它们。我正在做的是检查用户是否经过身份验证，如果没有，我将重定向到登录页面，如果他经过身份验证，我检查本地存储的令牌是否仍然有效，如果没有，则不会发生任何事情。如果过期，我将注销，这会从本地存储中删除信息并重定向到登录。所以我的问题是，有没有更好的方法来做到这一点，以及如何将这段代码放入一个可以被我所有需要保护的页面调用的函数中。

  ionViewWillEnter(): Promise<boolean> {
    return this.auth.isAuthenticated().pipe(
      tap(isAuthenticated => {
        if (!isAuthenticated) {
          this.navCtrl.navigateRoot('login')
        }
        else {
          this.auth.checkTokenValidity().subscribe(() => { }, err => {
            if (err.error.error === 'TokenExpiredError') {
              this.auth.logout(true).subscribe(() => {
                this.navCtrl.navigateRoot('login');
              });
            }
          })
        }
      })
    ).toPromise();
  }

标签： angularionic4

解决方案

我认为您想使用 Angular 的route guards。他们几乎按照你解释的方式工作。您有一个使用单个函数定义的类，该函数canActivate负责确定用户是否可以输入路由。

在您的情况下，这是您添加令牌验证的地方。然后在您的路由定义中，您只需将其添加到 canActivate 数组中即可添加到您想要保护的任何路由。我通常会创建一个受保护的顶级路线，然后该路线的任何孩子都会被自动保护。

推荐阅读