Angular2: перенаправлять на другой маршрут при выходе из системы

Question

Я немного борюсь с конкретным вариантом использования с Angular2 и маршрутизатором.

Предположим, у нас есть 3 маршрута. Главная, список и профиль.

«Профиль» - охраняемый маршрут: для доступа к этому маршруту пользователь должен пройти аутентификацию.

Если пользователь находится на странице «Профиль» и выходит из системы, я хочу, чтобы он мог обнаружить, что ему больше не разрешено находиться на текущей странице, и перенаправить его на страницу «Главная».

Однако, если он находится на странице «Список» и выходит из системы, я не хочу ничего делать (пользователю разрешено оставаться здесь, так как это не охраняемый маршрут).

Кто-нибудь знает, как я могу достичь этого, полагая, что у меня много маршрутов, и я хочу избежать, чтобы поставить эту логику «разрешено пользователем» в каждом компоненте?

Answer 1

Резюме

В моем случае я хотел, чтобы дать доступ моего пользователя к Охраняемым маршрутам путем проверки проверки лексемы я сохранить в локальное хранилище. Поэтому, если я их выхожу, я удаляю токен вместе с любыми данными, которые у меня есть в локальном хранилище. Вы можете использовать эту функцию в каждом маршруте.

public logout() { 
    localStorage.removeItem('profile'); 
    localStorage.removeItem('access_token'); 
    this.userProfile = undefined; 
    this.router.navigateByUrl('/home'); 
    }; 

Я создаю службу для аутентификации. Вы можете создать две разные службы или две разные функции. На самом деле у вас много вариантов. Вот один из вариантов.

Решение

Для выхода из системы и перенаправлять

public logout() { 
    localStorage.removeItem('profile'); 
    localStorage.removeItem('access_token'); 
    this.userProfile = undefined; 
    this.router.navigateByUrl('/home'); 
    }; 

Вы можете использовать эту функцию в каждом из компонентов. Или страницы. В основном перенаправлять маршрут, если пользователь находится на странице профиля. но если пользователь не находится на странице или маршрут, который должен быть перенаправлен затем удалить

this.router.navigateByUrl('/home'); 

Из функции, так что пользователь не перенаправляется.

Таким образом, вы могли бы иметь две услуги

public.service.ts 
    @Injectable() 
export class Public { 
    public logout() { 
     localStorage.removeItem('profile'); 
     localStorage.removeItem('access_token'); 
     this.userProfile = undefined; 
     }; 

Затем на ваших страницах, которые вы хотите зарегистрировать пользователя из но оставить их на том же использовании страницы эту услугу

export class SomeComponent { 
     constructor(private router: Router, private public: Public ) { } 
} 

Так что, когда использование функция выхода, которую он не будет перенаправлять.

Тогда для перенаправления, когда пользователь выходит из системы добавить эту услугу, как это,

 secure.service.ts 
    @Injectable() 
export class Secure { 
    public logout() { 
     localStorage.removeItem('profile'); 
     localStorage.removeItem('access_token'); 
     this.userProfile = undefined; 
     this.router.navigateByUrl('/home'); 
     }; 

И, конечно, любой компонент, который включает услугу слишком вы звоните в вашем html, как это правильно logout function,

<a class="myClass" href="#"(click)="public.logout()">Logout</a> 

или

<a class="myClass" href="#" (click)="secure.logout()">Logout</a>