Issue with roles in route meta

[Tristan Curtis]

Using

"vue": "^2.6.12",
"@websanova/vue-auth": "^4.1.3",
"vue-router": "^3.5.1",

Auth User

{
   "id":2,
   "first_name":"Test",
   "last_name":"User",
   "email":"[e-mail]",
   "security":{
      "roles":["admin"],
      "permissions":["manage billing"]
   }
}

Vue Auth Options

options: {
    rolesKey: 'security.permissions',
}

If I run the following it returns true

this.$auth.check('manage billing')

However if I use the same permission on a route, it redirects to the forbidden route every time no matter how many different formats I have tried.

{
path: 'home',
name: 'home',
component: () => import('@app/views/Home'),
meta: {
   title: 'Home',
   auth: {
      roles: 'manage billing', 
      rolesKey: 'security.permissions' // with or without
   }
},

{
path: 'home',
name: 'home',
component: () => import('@app/views/Home'),
meta: {
   title: 'Home',
   auth: 'manage billing',
},

{
path: 'home',
name: 'home',
component: () => import('@app/views/Home'),
meta: {
   title: 'Home',
   auth: ['manage billing'],
},

Any assistance would be appreciated.

[Rob Nova]

Good find, I've pushed up a fix in 4.1.4, let me know if that works :-)

[Tristan Curtis]

@websanova That did it. Thanks!

[Tristan Curtis]

I seem to be having another issue with auth meta and child routes. If a parent route has a role defined (or in my case permission) and the child route has no auth meta defined, it throws a forbidden error when visiting the child route. However if that child route has any auth defined it works. Not a huge deal to just set the child routes to true, just wasn't sure if that was an easy fix.

Won't work:

{ 
   path: '/admin', 
   component: () => import(/* webpackChunkName: "admin" */ '@admin/views/Layout'),
   meta: {
	title: 'Dashboard',
	auth: 'see admin',
   },
   children: [
      {
	   path: 'test',
           component: () => import(/* webpackChunkName: "admin_index" */ '@admin/views/Index'),
	   meta: {
	      title: 'Dashboard',
	   }
      }
   ]
},

Works:

{ 
   path: '/admin', 
   component: () => import(/* webpackChunkName: "admin" */ '@admin/views/Layout'),
   meta: {
	title: 'Dashboard',
	auth: 'see admin',
   },
   children: [
      {
	   path: 'test',
           component: () => import(/* webpackChunkName: "admin_index" */ '@admin/views/Index'),
	   meta: {
	      title: 'Dashboard',
              auth: true
	   }
      }
   ]
},

[Rob Nova]

Hmm, ya, because you have a string there, and it's checking for true, I think if you set the parent to true as well it should be fine. Otherwise it's just following the normal check, so probably just that parent check is failing.