Блог

Главная - Вопросы по программированию - Значение параметра углового маршрута заменяется именем параметра в AuthGuard canLoad

Значение параметра углового маршрута заменяется именем параметра в AuthGuard canLoad

#angular #auth-guard

#angular #auth-guard

Вопрос:

В моем AuthGuardService у меня есть функция canLoad, которая принимает параметр типа Route . Затем я присваиваю свой URL-адрес перенаправления аутентификации свойству path этого параметра маршрута.

Однако происходит нечто странное — если путь содержит параметр маршрута, то в свойстве path этот параметр заменяется именем параметра. Например, /hello/world/123 становится /hello/world/:id .

Это означает, что пользователь перенаправляется на /hello/world/:id, если аутентификация возобновляется, например, при перезагрузке страницы.

Как я могу это решить?

Я использую Angular 8.

Это из app-routes.ts:

 {
    path: 'hello/world/:id',
    loadChildren: () => import('./world/world.module').then(m => m.WorldModule),
    canActivate: [AuthGuardService],
    canActivateChild: [AuthGuardService],
    canLoad: [AuthGuardService],
}

world-routing.module.ts

 const routes: Routes = [
    {
        path: '',
        component: WorldComponent
    },
];

@NgModule({
    imports: [RouterModule.forChild(routes)],
    exports: [RouterModule],
})
export class WorldRoutingModule {}

world.module.ts

 @NgModule({
    declarations: [
        WorldComponent
    ],
    imports: [
        WorldRoutingModule,
        CommonModule,
        TranslateModule.forChild(),
        FormsModule
    ],
    exports: [
        WorldComponent
    ],
    providers: [L10nService],
    entryComponents: [],
})
export class WorldModule {}

Из AuthGuardService

 canLoad(route: Route) {
    if (this.validateTokenAccess()) {
        return true;
    }

    const url = `/${route.path}`;
    this.authService.redirectTo = url;
    this.authService.handleAuthentication();
    return false;
}

canActivate(next: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
    if (this.validateTokenAccess()) {
        return true;
    }

    this.authService.redirectTo = state.url;
    this.authService.handleAuthentication();
    return false;
}

canActivateChild(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
    return this.canActivate(route, state);
}

Комментарии:

1. Вы также получаете доступ к сегментам в canLoad (второй аргумент), так что, может быть, это нужно исследовать?

2. Спасибо @MikeOne! Я попытался использовать параметр segments, и я думаю, что он работает. Подробности кода см. В моем ответе.

3. Приятно! Рад, что это помогло.

Ответ №1:

Я попытался использовать вместо этого второй параметр canLoad типа UrlSegment[], как показано в приведенном ниже коде. Кажется, это работает. Я надеюсь, что это будет работать для всех маршрутов во всех ситуациях. Если кто-нибудь знает о какой-либо проблеме, которая может возникнуть, пожалуйста, дайте мне знать.

     canLoad(route: Route, segments: UrlSegment[]) {
        if (this.validateTokenAccess()) {
           return true;
        }

        // const url = `/${route.path}`;
        const url = segments.map(s => s.path).join('/');
    
        this.authService.redirectTo = url;
        this.authService.handleAuthentication();
        return false;
    }