要解决Angular 7中CanActivate守卫失效的问题,可以尝试以下解决方法:
import { CanActivate } from '@angular/router';
const routes: Routes = [
{ path: 'dashboard', component: DashboardComponent, canActivate: [AuthGuard] },
// ...
];
import { Injectable } from '@angular/core';
import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, Router } from '@angular/router';
@Injectable()
export class AuthGuard implements CanActivate {
constructor(private router: Router) {}
canActivate(next: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
// 检查是否已经登录
if (isLoggedIn()) {
return true;
}
// 如果未登录,重定向到登录页面
this.router.navigate(['/login']);
return false;
}
}
import { Injectable } from '@angular/core';
import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, Router } from '@angular/router';
import { AuthService } from './auth.service';
import { Observable } from 'rxjs';
@Injectable()
export class AuthGuard implements CanActivate {
constructor(private authService: AuthService, private router: Router) {}
canActivate(next: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable | Promise | boolean {
// 在此处处理异步逻辑,例如从后端获取身份验证信息
return this.authService.isLoggedIn().then((isLoggedIn: boolean) => {
if (isLoggedIn) {
return true;
} else {
this.router.navigate(['/login']);
return false;
}
});
}
}
这些解决方法应该能够帮助您解决Angular 7中CanActivate守卫失效的问题。