共计 1841 个字符，预计需要花费 5 分钟才能阅读完成。
路由守卫基础
路由守卫作用：
用于在导航到目标组件之前进行验证，符合条件才会导航到目标组件。
路由检查的顺序：
路由器会先按照从最深的子路由由下往上检查的顺序来检查 CanDeactivate() 和 CanActivateChild() 守卫。
然后它会按照从上到下的顺序检查 CanActivate() 守卫。如果特性模块是异步加载的，在加载它之前还会检查 CanLoad() 守卫。
如果任何一个守卫返回 false，其它尚未完成的守卫会被取消，整个导航就被取消。
惰性加载：
1. 只在用户请求时才加载。惰性加载和重新配置工作只会发生一次，也就是在该路由首次被请求时。在后续的请求中，该模块和路由都是立即可用的。
2. 必须在启动时加载的模块，其他模块都应该惰性加载。
预加载：
1. 根据预加载策略，在每次成功的导航后，路由器会在自己的配置中查找尚未加载并且可以预加载的模块进行加载。
2. 当前不需要但是随后马上就需要的模块应该预加载
（守卫接口）Guard interfaces
CanActivate 和 CanActivateChild
CanActivate：处理导航到某路由的情况。CanActivateChild：处理导航到某子路由的情况。
使用方法：
const adminRoutes: Routes = [
{
path: ”,
component: AdminComponent,
canActivate: [AuthGuard],//AuthGuard 验证通过，才允许访问 Admin 页面
children: [
{
path: ”,
canActivateChild: [AuthGuard],//AuthGuard 验证通过，才允许访问 Admin 页面的子页面
children: [
{path: ‘crises’, component: ManageCrisesComponent},
{path: ‘heroes’, component: ManageHeroesComponent},
{path: ”, component: AdminDashboardComponent}
]
}
]
}
];
应用示例：要求认证
工作流程：
CanDeactivate 和 Resolve CanDeactivate：处理从当前路由离开的情况。Resolve：在路由激活之前获取路由数据 使用方法：
const crisisCenterRoutes: Routes = [
{
path: ”,
component: CrisisCenterComponent,
children: [
{
path: ”,
component: CrisisListComponent,
children: [
{
path: ‘:id’,
component: CrisisDetailComponent,
canDeactivate: [CanDeactivateGuard], // CanDeactivate：处理从 CrisisDetailComponent 路由离开的情况
resolve: {//resolve：当所有必要数据都已经拿到之后，预先加载 CrisisDetailComponent 的路由数据
crisis: CrisisDetailResolverService
}
},
{
path: ”,
component: CrisisCenterHomeComponent
}
]
}
]
}
];
应用示例：用户尝试不保存或撤销更改就导航到外面。
工作流程：
CanLoad
CanLoad: 处理异步导航到某特性模块的情况。
使用方法：
const appRoutes: Routes = [
{
path: ‘compose’,
component: ComposeMessageComponent,
outlet: ‘popup’
},
{
path: ‘admin’,
loadChildren: ‘./admin/admin.module#AdminModule’,
canLoad: [AuthGuard]// 保护对特性模块的未授权加载，只有在用户已登录的情况下才加载 AdminModule
},
{
path: ‘crisis-center’,
loadChildren: ‘./crisis-center/crisis-center.module#CrisisCenterModule’,
data: {preload: true}
},
{path: ”, redirectTo: ‘/superheroes’, pathMatch: ‘full’},
{path: ‘**’, component: PageNotFoundComponent}
];
