Ограничить маршрутизацию для каждой роли - PullRequest
Новая
       5

Ограничить маршрутизацию для каждой роли

0 голосов
/ 24 января 2019

Можно ли ограничить определенные маршруты и / или изменить компоненты для любого маршрута на основе значения, такого как роль зарегистрированного пользователя?

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

Или лучше использовать базовый компонент, перенаправляющий на другой маршрут?

Я понимаю, что ограничение доступа через маршрутизатор не заменяет реальную безопасность учетной записи, но может показаться первым хорошим шагом в предотвращении угадывания пользователями ограниченных маршрутов.

1 Ответ

0 голосов
/ 24 января 2019

Вот отличный пример реализации аутентификации и авторизации с помощью vue router: https://scotch.io/tutorials/vue-authentication-and-route-handling-using-vue-router

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

{
  path: '/proctected',
  beforeEnter(to, from, next) {
    if (isAuthenticated()) {
      if (!hasPermissionsNeeded(to)) {
        next('/page-to-show-for-no-permission');
      } else {
        next();
      }
    } else {
      next('/page-to-show-for-unauthenticated-users');
    }
  }
}

Этот охранник защитит от ввода /proctected url.Здесь вы можете проверить рабочий код: https://codepen.io/anon/pen/JwxoMe

Ниже приведен пример защиты для всех маршрутов: 

router.beforeEach((to, from, next) => {
  if (isAuthenticated()) {
    if (!hasPermissionsNeeded(to)) {
      next('/page-to-show-for-no-permission');
    } else {
      next();
    }
  } else {
    next('/page-to-show-for-unauthenticated-users');
  }
})

Подробнее о защите маршрутизатора: https://router.vuejs.org/guide/advanced/navigation-guards.html#per-route-guard

...