Question

我的角度4应用程序有几条路线：

const appRoutes: Routes = [
  { path: '', component: MainMenuComponent, canActivate: [AuthGuard] },
  { path: 'Content', component: ContentComponent, canActivate: [AuthGuard] },
  { path: 'Organisations', component: OrganisationComponent, canActivate: [AuthGuard] },
  { path: 'Licenses', component: LicenseComponent, canActivate: [AuthGuard] },
  { path: 'Logs', component: LogsComponent, canActivate: [AuthGuard] },
  { path: 'Community', component: CommunityComponent, canActivate: [AuthGuard] },
  { path: 'Profile', component: ProfileComponent, canActivate: [AuthGuard] },
  { path: 'Signup', component: SignupComponent },
  { path: 'Login', component: SigninComponent },
  { path: 'Landing', component: LandingPageComponent},
  { path: '**', component: MainMenuComponent , canActivate: [AuthGuard]}, // Page not Found
];

每个带[AuthGuard]的页面只能由经过身份验证的用户激活。

AuthGuard看起来像这样：

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {

if  (this.authService.isAuthenticated)
{
  return true;
}
else
{
  this.router.navigate(['Landing']);
}

如果用户已通过身份验证，则可以访问该路由，如果没有，则会将用户重定向回到目标网页。

当按下网站上导致某些路线的按钮时，例如：

<a routerLink="/Content"> Content</a>

身份验证可以正常运行，但是当我手动将路由键入URL栏时，即使用户已经过身份验证，用户也会被重定向回登陆页面。

我试图理解为什么会这样，并找出我如何解决它。

Answer 1

也许您的authService是异步的，或者会话未保存在localStorage中，当您尝试通过URL手动获取页面时，您的角度保护不会保存当前用户。

试试这个：

更改canActivate方法以使用promises
将您的会话保存在localStorage或Cookie中，并在启动网站时恢复sessión（如果存在）

#define WIDEN_STRING(x) WIDEN_STRING_(x)
#define WIDEN_STRING_(x) L ## x
#define STRINGIFY(x) STRINGIFY_(x)
#define STRINGIFY_(x) #x

手动更改URL时，Angular 4 Routeguard无法正常工作

1 个答案: