如何处理来自数据库的路由权限？答案

【问题标题】：How to handle permissions for route from database?如何处理来自数据库的路由权限？
【发布时间】：2018-12-13 19:02:25
【问题描述】：

在vue中，当我想限制某些用户的某些页面时，在路由器中我在meta中定义了一个权限，如下所示：

routes: [
    {
        path: 'transport',
        name: 'transport',
        component: Transport,
        meta: { permission: "edit_transport" }
    },
]

当用户登录时，我拥有 JWT，我可以在其中找到他/她拥有的权限，在 route.beforeEach 中，我检查用户是否拥有此权限，他/她可以访问一个页面。

router.beforeEach((to, from, next) => {
    let token = window.localStorage.getItem('user_token');

    if(to.meta.permission == 'edit_transport') {
       //if user's token has edit_tranport permission let him visit the page
    }
})

但是，现在我有了这个权限在数据库中，有一个表，其中管理员定义了页面的权限：

id     permision         page
_____________________________________
1      edit_transport    transport
2      write_post        create_post

这意味着，例如用户需要edit_transport 权限才能访问传输页面。

我有解决方案，但我不知道是好是坏，所以我需要帮助

我的解决方案是：首先我必须从数据库中获取所有这些权限并将它们保存在vuex 存储中，然后在route.beforeEach 中访问此存储数据并检查页面需要什么权限，然后检查用户是否具有此权限

router.beforeEach((to, from, next) => {
    let token = window.localStorage.getItem('user_token');
    let pagepermission = store.permissions[to.name]
    if (token.has(pagepermission)) {
        // let user visit the page
    } else {
        // redirect
    }
})

那么，这是一个好方法还是有其他更好的方法呢？

【问题讨论】：

我会这样做，只要这些页面上还有额外的服务器端权限检查，这也适用于您之前的解决方案。

标签： vue.js vuex vue-router

【解决方案1】：

这是在客户端进行的一项很好的检查，如果您还在后端保护路由/端点，我认为这将是最全面的解决方案。

我不确定您在后端使用的是什么，但如果它是 Node，您可以使用 Passport 之类的东西来管理角色 - 作为路由和端点的中间件。

【讨论】：