Vben设计了2种权限模式,分别是【前端角色权限(ROLE)】和【后端动态获取(BACK)】
详细说明请参考https://doc.vvbin.cn/guide/auth.html
为了打造【轻前端重后端】我们希望后端可以操纵这个权限模式,而无需通过重新编译【前端代码】的方式实现模式切换
第一步:打开 \src\utils\http\axios\index.ts 文件,添加import代码
import { useAppStore } from '/@/store/modules/app';
然后在169行附近找到下面“响应拦截器处理”参考修改代码
/** * @description: 响应拦截器处理 */ responseInterceptors: (res: AxiosResponse<any>) => { if (res.data.hasOwnProperty('setProjectConfig')) { const appStore = useAppStore(); appStore.setProjectConfig(res.data.setProjectConfig); } return res; },
第二步:修改后端代码,参考下面代码
router.get(`${sPathRoot}/getUserInfo`, async (ctx, next) => { ctx.body.code = 0; ctx.body.type = 'success'; ctx.body.message = 'ok'; ctx.body.setProjectConfig = {}; ctx.body.setProjectConfig['permissionMode'] = 'ROUTE_MAPPING'; ctx.body.setProjectConfig['permissionMode'] = 'ROLE'; ctx.body.setProjectConfig['permissionMode'] = 'BACK'; ctx.body.result = { "userId": "1", "username": "vben", "realName": "Vben Admin", "avatar": "https://q1.qlogo.cn/g?b=qq&nk=190848757&s=640", "desc": "manager", "password": "123456", "token": "fakeToken1", "homePath": "/dashboard/analysis", "roles": [ { "roleName": "Super Admin", "value": "super" } ] }; });
完成
router.get(`${sPathRoot}/getUserInfo`, async (ctx, next) => { ctx.body.code = 0; ctx.body.type = 'success'; ctx.body.message = 'ok'; ctx.body.setProjectConfig = {}; ctx.body.setProjectConfig['permissionMode'] = 'ROUTE_MAPPING'; ctx.body.setProjectConfig['permissionMode'] = 'ROLE'; ctx.body.setProjectConfig['permissionMode'] = 'BACK'; ctx.body.result = { "userId": "1", "username": "vben", "realName": "Vben Admin", "avatar": "https://q1.qlogo.cn/g?b=qq&nk=190848757&s=640", "desc": "manager", "password": "123456", "token": "fakeToken1", "homePath": "/dashboard/analysis", "roles": [ { "roleName": "Super Admin", "value": "super" } ] }; }); 标签:body,Vben,Admin,ctx,permissionMode,玩转,setProjectConfig From: https://www.cnblogs.com/xiangxisheng/p/17044802.html