如何在vue js中过滤特定用户的路由

时间:2019-01-21 11:30:10

标签: javascript laravel vue.js vuejs2 vue-router

我想根据用户角色过滤一些路由。

例如,我有两种类型的用户:adminviewer

我该如何过滤路由,因此,如果登录名为viewer的用户无法访问该路由,则必须使用元admin

到目前为止我尝试过的。

这是我的general.js

export function initialize(store, router) {
    router.beforeEach((to, from, next) => {
        const requiresAuth = to.matched.some(record => record.meta.requiresAuth);
        const currentUser = store.state.currentUser;
        console.log(currentUser)

        if(requiresAuth && !currentUser) {
            next('/loginadmin');
        } else if(to.path == '/loginadmin' && currentUser) {
            next('/homeadmin');
        } else if(to.path == '/login') {
            next('/homeadmin');
        }else {
            next();
        }
    });

    axios.interceptors.response.use(null, (error) => {
        if (error.response.status == 401) {
            store.commit('logout');
            router.push('/loginadmin');
        }

        return Promise.reject(error);
    });

    if (store.getters.currentUser) {
        setAuthorization(store.getters.currentUser.token);
    }
}

export function setAuthorization(token) {
    axios.defaults.headers.common["Authorization"] = `Bearer ${token}`
}

这是我的路线

{
        path: '/homeadmin',
        component: Home,
        meta: {
            requiresAuth: true
            is_admin: 'admin'
        }
    },
{
        path: '/homeadmin',
        component: Home,
        meta: {
            requiresAuth: true
        }
    },

我将角色存储在const currentUser = store.state.currentUser;

获得用户角色的完整路径是store.state.currentUser.role

我该怎么做?

0 个答案:

没有答案