import {createRouter, createWebHistory} from "vue-router"; import {staticRouter} from "@/router/staticRouters.ts"; import {message, Modal} from "ant-design-vue"; import {useUserStore} from "@/stores/modules/userStore.ts"; import {ROUTER_WHITE_LIST} from "@/config"; /** * createWebHistory & createWebHashHistory * createWebHistory: 路径不带#号,但需要后端进行配置(如nginx配置:try_files $uri $uri/ /index.html last;) * createWebHashHistory: 路径带#号 这部分 URL 从未被发送到服务器,所以它不需要在服务器层面上进行任何特殊处理,影响SEO */ const router = createRouter({ history: createWebHistory(), routes: [...staticRouter], strict: false, scrollBehavior: () => ({left: 0, top: 0}) }); router.beforeEach(async (to, from, next) => { Modal.destroyAll(); //判断访问的是不是登录页 const userStore = useUserStore(); if (to.path.toLocaleLowerCase() === '/login' && userStore.getTokenInfo?.value) { //如果已登录 且访问login页面 直接返回当前页面 await message.warn('当前已登录,请先退出账号'); return next(from.fullPath) } //判断访问路径是不是白名单d if (ROUTER_WHITE_LIST.includes(to.path)) { return next(); } // 不在白名单内需要查看是否携带token 没有token需要返回登录页进行登录 if (!userStore.getTokenInfo?.value) { await message.warn('未找到token,请重新登陆!') return next('/login'); } //放行 return next(); }) router.onError(error => { console.error("路由错误", error.message); }) export default router