对于一个项目,我有一个路由器,其中包含以下可用路径:
const appRoutes: Routes = [
{path: '', component: AppComponent},
{path: 'dashboard', component: DashboardComponent},
{path: 'leaderboard', component: LeaderboardComponent},
{path: 'authentication', component: AuthenticationComponent},
{path: '**', redirectTo: '/authentication', pathMatch: 'full}
];
AuthenticationComponent的Injectable Service正在处理路由器 . 如果没有身份验证,用户将被重定向到/身份验证,无论路由是什么,如果他已登录,则重定向到/ dashboard .
问题是如果我想重新加载/排行榜页面,它每次都会重定向到/ dashboard,它也不应该是身份验证服务的工作 .
我已经尝试过,使用This guide来理解警卫,这使我能够通过/仪表板和/排行榜处理基本导航,Auth0的回调和刷新,但是当我已经认证时访问我的登录页面时,它不是重定向,与未知路径相同的行为 .
有没有办法让我检查我的路由器是否知道所提供的路由,并且如果用户已登录则正确重定向?
我的卫兵:
import {ActivatedRouteSnapshot, CanActivate, Router, RouterStateSnapshot} from '@angular/router';
import {AuthenticationService} from './component/authentification/authentication.service';
import {Injectable} from '@angular/core';
@Injectable()
export class AuthGuard implements CanActivate {
constructor(private authService: AuthenticationService,
private router: Router) {
}
canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
console.log(route, state);
this.authService.handleAuthentication();
if (this.authService.isAuthenticated()) {
return (true);
} else {
this.router.navigate(['/authentication']);
}
}
}
我目前的路由器:
import {NgModule} from '@angular/core';
import {RouterModule, Routes} from '@angular/router';
import {DashboardComponent} from './component/dashboard/dashboard.component';
import {LeaderboardComponent} from './component/leaderboard/leaderboard.component';
import {AuthenticationComponent} from './component/authentification/authentication.component';
import {AppComponent} from './app.component';
import {AuthGuard} from "./app-routing.guard";
const appRoutes: Routes = [
{path: '', canActivate: [AuthGuard], redirectTo: '/dashboard', pathMatch: 'full'},
{path: 'dashboard', canActivate: [AuthGuard], component: DashboardComponent},
{path: 'leaderboard', canActivate: [AuthGuard], component: LeaderboardComponent},
{path: 'authentication', component: AuthenticationComponent},
{path: '**', canActivate: [AuthGuard], redirectTo: '/authentication'}
];
@NgModule({
imports: [
RouterModule.forRoot(
appRoutes
)
],
exports: [
RouterModule
]
})
export class AppRoutingModule {
}