Когда у моих пользователей появляются грязные изменения на экране, у меня есть защита маршрута, которая предлагает им сохранить или отменить изменения, когда они пытаются уйти.
Однако, если я выхожу из них из-за бездействия, я хочу принудительно выполнить навигацию и обойти защиту маршрута (отменив их изменения), чтобы убедиться, что их экран отключен.
Как обойти охрану маршрута?
Мое решение было следующим:
Мой метод logout после успешного выхода из системы перенаправляет приложение на маршрут /login:
@Injectable
export class AuthService {
// ...
logout () {
// do logout
this.router.navigate(['/login']);
}
}
Тогда моя защита выглядит следующим образом:
@Injectable
export class DiscardChangesGuard implements CanDeactivate<MyComponent> {
canDeactivate(component: MyComponent, currentRoute: ActivatedRouteSnapshot,
currentState: RouterStateSnapshot, nextState?: RouterStateSnapshot): Observable<boolean> | boolean {
if (nextState.url === '/login') {
return true; // bypass checks if we are trying to go to /login
}
// perform regular checks here
}
}
Вот как можно принудительно обойти для каждой навигации. В моем случае я возвращался к панели управления учетной записью после того, как пользователь отправлял форму с информацией об учетной записи.
В идеале вы должны проверить несохраненные изменения в форме и обойти их, но в моих формах пока нет этой функции.
компонент формы:
this.router.navigateByUrl('/', { state: { bypassFormGuard: true } })
защита маршрутизатора:
@Injectable()
export class ExitFormGuard implements CanDeactivate<ComponentCanDeactivate> {
constructor(private router: Router) {}
canDeactivate(component: ComponentCanDeactivate): boolean | Observable<boolean> {
// gets nav object IF one exists
const navObject = this.router.getCurrentNavigation()
// bypass the form guard based on navigation state
// (used when navigating out after form submit)
if (navObject && navObject.extras.state && navObject.extras.state.bypassFormGuard) {
return true
}
// perform normal checks
}
}
Моя цель состояла в том, чтобы обойти защиту маршрута, не касаясь каждой защиты маршрута в приложении, но я не смог этого сделать. В конце концов я создал новый RouteBypassService для внедрения в каждую защиту маршрута. RouteBypassService реализует shouldBypass, который возвращает true, если защита маршрута должна разрешать навигацию по какой-либо внеплановой причине, такой как авторизация. В моем случае shouldBypass возвращает true, если пользователь не вошел в систему. (После того, как они вышли из системы, мы позволяем им уйти с экрана, несмотря ни на что).
Это не идеально, потому что каждый автор защиты маршрута должен обязательно помнить о добавлении обхода, но это не сильно запутывает.
