admin_home/src/permission.js

//1.引入vue-element-admin 依赖 start ---------------------------------------->
import router from './router'//引入路由
const whiteList = ['/login', '/auth-redirect','/no-permission']//配置路由白名单
import store from './store'//引入vuex
import { Message } from 'element-ui'//引入element的弹框提示
import getPageTitle from '@/utils/get-page-title'//获得系统标题
import NProgress from 'nprogress'//引入进度条库
import 'nprogress/nprogress.css'//引入进度条样式
NProgress.configure({ showSpinner: false })
//1.引入vue-element-admin依赖 end ---------------------------------------->

//2.引入单点登录需要的方法 start ---------------------------------------->
import { getToken, setUserUrl, getUseType, getUserUrl,setUseType,setWebSiteId,
hashParams,removeToken,getLoginType,getBackUrlValue } from '@/utils/auth' //设置cookie的方法
import URL from '@/utils/baseUrl'; //获得请求路径
import { getInfo } from '@/api/user' //获得用户信息
//2.引入单点登录需要的方法 end ---------------------------------------->

//3.设置路由守卫 start ---------------------------------------->
router.beforeEach(async (to, from, next) => {
    //3.1 当路由开始改变时，加载进度条
    NProgress.start()
    //3.2 设置系统标题
    document.title = getPageTitle(to.meta.title)
    //3.3 检查cookie中的token是否已经存在
    const hasToken = getToken()

    //3.4 如果token存在
    if (hasToken) {
        //3.4.1 如果有token，而且是在登录页面
        if (to.path === '/login') {
            //获取登录参数，是backurl还是userurl
            let loginType = getLoginType(window.location.href)
            if(loginType == 'userurl'){
                //如果是userurl
                const userurl = hashParams();
                if (userurl) {
                    setUserUrl(userurl, 86400)
                }
                const userInfo = await getInfo();
                console.log("User Info:", userInfo);
                if (userInfo.code === 200) {
                    console.log("####")
                    //每次返回login的时候都获取一下用户类型和网站id
                    setUseType(userInfo.data.type_id, 86400)
                    setWebSiteId(userInfo.data.website_id, 86400)
                    next({ path: '/' })
                    NProgress.done() 
                } else {
                    if(userInfo.code == -1){
                        next({ path: '/' })
                        NProgress.done()
                    }else{
                        next({ path: '/' })
                        NProgress.done()
                    }
                }
            }
            if(loginType == 'backurl'){
                const userInfo = await getInfo();
                //此时分为两种情况，如果这个用户的token被放入了黑名单，此时不能允许用户带着token返回原网站
                //否则他就会一直登录不了，这个时候应该让他重新登录
                if(userInfo.code == 400){
                    //跳转到登录页面
                    if (to.path !== '/no-permission') {
                        //避免重复跳转
                        next({path:'/no-permission'})
                    } else {
                        //已经在无权限页面，不再跳转
                        next()
                    }
                }else{
                    //如果不是400，说明用户的这个token是可以用的，可以带着token返回C端
                    //如果是backurl
                    const backurl = getBackUrlValue(window.location.href)
                    //带着token返回原网站
                    window.location.href = backurl + '?backurl=' + backurl + '&admintoken=' + getToken()
                }
            }
        } else {
            //3.4.2 如果有token，但是没在登录页面
            const hasRoles = store.getters.roles && store.getters.roles.length > 0
            //此时分为两种情况，一种是用户通过路由访问，一种是用户从url直接访问（刷新）时执行
            if (hasRoles) {
                const userInfo = await getInfo();
                //如果用户没有权限登录该网站，返回登录页面
                if(userInfo.code == 400){
                    console.log("用户没有访问权限，将跳转到无权限页面！")
                    if (to.path !== '/no-permission') {
                        //到达此页面后直接清理token,避免出现用户直接从url返回login导致无限循环
                        removeToken()
                        //避免重复跳转
                        next({path:'/no-permission'})
                    } else {
                        //已经在无权限页面，不再跳转
                        next()
                    }
                    NProgress.done()
                }else{
                    setUseType(userInfo.data.type_id, 86400)
                    setWebSiteId(userInfo.data.website_id, 86400)
                    console.log("用户有访问权限，访问继续！")

                    //稳定性待测试
                    if(router.options.routes.length < 2){
                        console.log("用户路由出现异常，重新获取路由菜单！")
                        const { roles } = await store.dispatch('user/getInfo')
                        const accessRoutes = await store.dispatch('permission/generateRoutes', roles)
                        router.addRoutes(accessRoutes)
                        console.log("添加路由成功！")
                    }
                    next()
                }
            } else {
                //页面刷新的时候执行
                try {
                    const { roles } = await store.dispatch('user/getInfo')
                    const accessRoutes = await store.dispatch('permission/generateRoutes', roles)
                    router.addRoutes(accessRoutes)
                    next({ ...to, replace: true })
                    console.log("添加路由成功！")
                } catch (error) {
                    await store.dispatch('user/resetToken')
                    Message.error(error || 'Has Error')
                    next(`/login?redirect=${to.path}`)
                    NProgress.done()
                }
            }
        }

    } else {
        //3.5 如果token不存在
        if (whiteList.indexOf(to.path) !== -1) {
            const userurl = hashParams();
            if(userurl){
                //更新backurl
                setUserUrl(userurl, 86400) 
            }else{
                //设置来源网站为当前域名
                setUserUrl(window.location.host,86400);
            }
            next()
        } else {
            next(`/login`)
            NProgress.done()
        }
    }
})

router.afterEach(() => {
    //路由改变完毕后，结束进度条
    NProgress.done()
})
//3.设置路由守卫 end ---------------------------------------->