0👍
✅
After loggin in the user, yo can check its role and redirect it to his corresponding home with a router.push("homeX") for example. And then in the router file, do something like this:
export const router = new Router({
mode: 'history',
routes: [
{
path: '/',
component: HomePage,
meta: { authorize: [] }
},
{
path: '/homeX',
component: HomeX,
meta: { authorize: [Role.X], role: "X" }
},
{
path: '/homeY',
component: HomeY,
meta: { authorize: [Role.Y], role: "Y" }
},
{
path: '/login',
component: LoginPage
},
// otherwise redirect to home
{ path: '*', redirect: '/' }
]
});
router.beforeEach((to, from, next) => {
// redirect to login page if not logged in and trying to access a restricted page
const { authorize } = to.meta;
const currentUser = authenticationService.currentUserValue;
if (authorize) {
if (!currentUser) {
// not logged in so redirect to login page with the return url
return next({ path: '/login', query: { returnUrl: to.path } });
}
// check if route is restricted by role
if (authorize.length && currentUser.role !== to.meta.role) {
// role not authorised so redirect to home page
return next({ path: '/' });
}
}
next();
})
Source:stackexchange.com