比如:一些登录授权、账号绑定解绑页面、用户购买页面其实都是需要用户传递token 或者openid 或者 其他一些固定的参数需要做用户验证的
当用户当前账户长时间不登录 过期的时候可以强制要求用户重新登录授权。
// request拦截器 service.interceptors.request.use(config => { // 请求header中携带信息 //封装一个方法获取当前用户的token //具体怎么获取token 或者openid 等信息根据自己的业务决定 config.headers['Authorization'] = getUserInfo().token; return config }, error => { // Do something with request error //这里使用一个UI组件的toast组件给予用户提示。 toast({ type: "fail", message: "网络请求出错" }); if (typeof error == 'object') { onSensors("requestError", { error: error.toString() }); } return Promise.reject(error) }) 复制代码
// respone拦截器 处理普通的响应错误状态 并予以提示 service.interceptors.response.use(response => { if (response.status >= 200 && response.status < 300 && response.data && response.headers) { // success return { res: response.data, headers: response.headers } } else { toast({ type: "fail", message: "httpStatusCode:" + response.status }); } }, error => { if (error.response && error.response.status && error.response.status == 401) { removeCookies(); checkLogin(() => { //do something when cookie is exist }); return; } toast({ type: "fail", message: "网络响应错误" }); onSensors("responseError", { error: error.toString() }); return Promise.reject(error) }) 复制代码
//描述 捕获401 http response 拦截器, 并对返回的errcode 进行判断,如果是过期的话重新唤起授权 axios.interceptors.response.use( response => { const res = response.data if (res.errcode === xxx || res.errCode === xxxx) { window.location.href = `重新授权登录接口拼接回调` } else { return response } }, error => { if (error.response) { switch (error.response.status) { case 401: window.location.href = `重新授权登录接口拼接回调` } } return Promise.reject(error.response.data) // 返回接口返回的错误信息 }); 复制代码