Question

我正在尝试在令牌过期时将用户重定向到登录页面。但是，此代码适用于Angular Web版本。如何在ionic3中使用类似的概念？

   import { Injectable } from '@angular/core';
    import { Router, CanActivate } from '@angular/router';
    import { AuthProvider } from './auth.provider';
    import { NavController } from 'ionic-angular';

    @Injectable()
    export class AuthGuardService implements CanActivate {
      constructor(public auth: AuthService, public router: Router, public navCtrl: NavController) {}
      canActivate(): boolean {
        if (!this.auth.isAuthenticated()) {
          this.navCtrl.push(['LoginPage']);
          return false;
        }
        return true;
      }
    }

我通过添加Navctrl push进行了一些小的更改，但是我应该对CanActivate之类的其他部件做什么。在Ionic 3中工作时应替换什么？

Answer 1

对于离子2/3，CanActivate不适用。您将需要在离子页面本身中使用ionViewCanEnter()生命周期功能。

constructor(public auth: AuthService,public navCtrl: NavController){}//inject your auth service(instead of in auth guard) in the page where the guard is needed. 

ionViewCanEnter():boolean{
  if (!this.auth.isAuthenticated()) {
      this.navCtrl.push('LoginPage');
      return false;
    }
    return true;  
}

Answer 2

ionViewCanEnter 生命周期方法是离子3的正确解决方案。如果您需要使用Promise进行身份验证呼叫，则可以为 async 。

async ionViewCanEnter(){
    const isAuthenticated =  await this.authService.isAuthenticated();
    if (!isAuthenticated) {
      this.authService.signIn();
    }   
    return isAuthenticated;
  }

如何修复此提供程序以使其在Ionic 3中正常工作

2 个答案: