登录失效后,后端拦截器拦截并跳转到登录失效方法,该方法返回对应的code编码,如果报错跨域,加上跨域注解@CrossOrigin
@ResponseBody@CrossOrigin //目标方法上加入这个解决跨域@RequestMapping(value = { "/tokentimeout"})public JSONObject tokentimeout(Model model, HttpServletRequest request) {System.out.println("sssss");Map<String, Object> result5 = new HashMap<String,Object>();result5.put("code",408);result5.put("result",null);result5.put("message","tokentimeout!");result5.put("type","error");JSONObject result8 = JSONObject.parseObject(JSON.toJSONString(result5));System.out.println(result8);return result8;}
前端设置对响应数据进行拦截,配置文件在vben-admin-thin-next-main\src\utils\http\axios\index.ts
,在transformRequestHook中进行配置,代码在throw new Error(timeoutMsg || t('sys.api.apiRequestFailed'));
进行插入,如图
// 在此处根据自己项目的实际情况对不同的code执行不同的操作// 如果不希望中断当前请求,请return数据,否则直接抛出异常即可//这里默认判断code是否为401,如果是401,则直接自动注销跳回登录界面let timeoutMsg = '';switch (code) {case ResultEnum.TIMEOUT:timeoutMsg = t('sys.api.timeoutMessage');const userStore = useUserStoreWithOut();userStore.setToken(undefined);userStore.logout(true);break;default:if (message) {timeoutMsg = message;}}//这里默认判断code是否为408,如果是408,则弹出询问框是否自动注销跳回登录界面if (code === 408) {createConfirm({iconType: 'warning',title: '提示',content: t('sys.api.timeoutMessage'),okText: t('common.okText'),cancelText: t('common.cancelText'),onOk: async () => {const userStore = useUserStoreWithOut();await userStore.logout(true);location.reload();},});return false;}