onemap-implementationSupervision-system-frontend/website/src/permission.js

/*
 * @Descripttion: 
 * @version: 
 * @Author: siwei
 * @Date: 2023-02-22 11:38:48
 * @LastEditors: siwei
 * @LastEditTime: 2023-03-03 16:24:58
 */
import router from './router'
import store from './store'
import { ElMessage } from 'element-plus'
import NProgress from 'nprogress'
import 'nprogress/nprogress.css'
import { getToken } from '@/utils/auth'
import { isHttp } from '@/utils/validate'
import { checkToken, currentUserInfo } from "@/api/login";


NProgress.configure({ showSpinner: false });

const whiteList = ['/login', '/auth-redirect', '/bind', '/register'];

router.beforeEach((to, from, next) => {
    // 全局前置守卫
    NProgress.start()
        // 获取地址栏参数
    if (to.query && to.query.token && to.path === '/page') {
        let access_token = to.query.token
        console.log('校验Token是否过期');
        //#region test
        // // 获取username
        // let username = 'admin'
        // // 调用action的登录方法，进行自动认证登录
        // console.log('开始自动认证登录');
        // store.dispatch("LoginNew", username)
        //   .then(() => {
        //     store.commit("SET_SUPERUSER", username);
        //     store.commit("SET_SUPERTOKEN", access_token);
        //     next()
        //   })
        //   .catch((e) => {
        //     console.log('认证登录失败:');
        //     next(`/login?redirect=/`) // 否则全部重定向到登录页
        //   });
        //#endregion

        checkToken(access_token).then(res => {
            console.log('Token未过期，获取Token对应登录用户信息');
            // 获取Token对应登录用户信息
            currentUserInfo(access_token).then(res => {
                    console.log('用户信息获取成功:' + res.data);
                    // 获取username
                    let username = res.data.user_name
                        // 调用action的登录方法，进行自动认证登录
                    console.log('开始自动认证登录');
                    store.dispatch("LoginNew", username)
                        .then(() => {
                            store.commit("SET_SUPERUSER", username);
                            store.commit("SET_SUPERTOKEN", access_token);
                            next()
                        })
                        .catch((e) => {
                            console.log('认证登录失败:');
                            next(`/login?redirect=/`) // 否则全部重定向到登录页
                        });
                })
                .catch((e) => {
                    console.log('用户信息获取失败');
                    next(`/login?redirect=/`) // 否则全部重定向到登录页
                });
        }).catch(e => {
            console.log('Token过期，请重新登录！');
            next(`/login?redirect=/`) // 否则全部重定向到登录页
        })
    } else {
        if (getToken()) {

            //#region 获取单点登录的token,验证token是否过期
            let tk = store.getters.superToken
            if (!tk && to.query && to.query.token) {
                tk = to.query.token
                store.commit("SET_SUPERTOKEN", tk);
            }
            //#endregion

            to.meta.title && store.dispatch('settings/setTitle', to.meta.title)
                /* has token*/
            if (to.path === '/login') {
                next({ path: '/' })
                NProgress.done()
            } else if (!tk && to.path === '/page') {
                next({ path: '/home' })
            } else {
                if (store.getters.roles.length === 0) {
                    // 判断当前用户是否已拉取完user_info信息
                    store.dispatch('GetInfo').then(() => {
                        store.dispatch('GenerateRoutes').then(accessRoutes => {
                            // 根据roles权限生成可访问的路由表
                            accessRoutes.forEach(route => {
                                if (!isHttp(route.path)) {
                                    router.addRoute(route) // 动态添加可访问路由表
                                }
                            })
                            next({...to, replace: true }) // hack方法 确保addRoutes已完成
                        })
                    }).catch(err => {
                        store.dispatch('LogOut').then(() => {
                            ElMessage.error(err)
                            next({ path: '/' })
                        })
                    })
                } else {
                    //#region 单点修改代码片段，跳转验证token是否过期
                    if (tk) {
                        console.log('检验token是否过期');
                        checkToken(tk).then(res => {
                            console.log('Token未过期,正常跳转');
                            next()
                        }).catch(e => {
                            console.log('Token过期，请重新登录！');
                            store.commit("SET_SUPERUSER", "");
                            store.commit("SET_SUPERTOKEN", "");
                            next(`/login?redirect=/`) // 否则全部重定向到登录页
                            return
                        })
                    } else {
                        next()
                    }
                    //#endregion

                    //#region 改前代码
                    // next()
                    //#endregion

                }
            }
        } else {
            // 没有token
            if (whiteList.indexOf(to.path) !== -1) {
                // 在免登录白名单，直接进入
                next()
            } else {
                next(`/login?redirect=${to.path}`) // 否则全部重定向到登录页
                NProgress.done()
            }
        }
    }
})

router.afterEach(() => {
    NProgress.done()
})