Bootstrap

移动校园(7)ii:uniapp响应拦截器处理token,以及微信小程序报错当前页面正在处于跳转状态,请稍后再进行跳转....

依据昨天的写完,在token过期之后,再次调用接口,会触发后端拦截,扔进全局错误处理中间件

前端说明提示都没有,只有一个这个,现在优化一下,再写一个类似全局后置守卫,当状态码是401的时候,重新登录,可是原生没有相应拦截器,昨天找的路由守卫也只能告诉to,from。翻看官方文档,发现statuscode可以由uni.request成功回调的statuscode获取,意思就是对昨天封装的uni.request加一条statuscode判断以及重定向就行

改了半天还是不会失败自动跳转,我以为响应拦截器写错了,于是升级了一下,可还是失败

import  config  from "./config.js"

const request = (options) => {
	return new Promise((resolve, reject) => {
		let token = uni.getStorageSync('token')
		uni.request({
			url: config.baseUrl + options.url,
			method: options.method || 'GET',
			header: options.header || {
				authorization: token,
			},
			data: options.data || {},
			success: (res) => {
				const data = res
				if (res.statusCode !== 200) {
					console.log(res.statusCode)
					handleStatus(res) //处理状态码
					return
				}
				resolve(data)
			},
			fail: (error) => {
				uni.showToast({
					icon: 'error',
					title: '系统错误'
				})
				reject(error)
			},
			complete: (res) => {
 
			}
		})
	})
}
const handleStatus = (res) => {
	switch (res.statusCode) {
		// 401: 未登录
		// 未登录则跳转登录页面,并携带当前页面的路径
		// 在登录成功后返回当前页面,这一步需要在登录页操作。                
		case 401:
		uni.navigateTo({
			url: "/pages/login/login",
		})
		uni.showToast({
			icon: 'error',
			title: '未登录'
		})
			return
			break;
 
			// 403 token过期
			// 登录过期对用户进行提示
			// 清除本地token和清空vuex中token对象
			// 跳转登录页面                
		case 403:
		uni.navigateTo({
			url: "/pages/login/login",
			fail:function()
			{
				console.log('fail')
			}
		})
			uni.showToast({
				icon: 'error',
				title: '登录过期'
			})
			uni.removeStorageSync("token")
			break;
 
			// 404请求不存在
		case 404:
 
			break;
			// 其他错误,直接抛出错误提示
		default:
	}
}
export function get(option) {
	return new Promise((resolve, reject) => {
		request({
			...option,
			method:'GET'
		}).then(res => {
			resolve(res);
		}).catch(err => {
			reject(err)
		})
	});
}
export function post(option) {
	return new Promise((resolve, reject) => {
		request({
				...option,
				method: 'POST',
			})
			.then(res => {
				resolve(res);
			})
			.catch(err => {
				reject(err)
			})
	});
}


明明控制台都打印了,可是就是不跳转,页面跳转始终失败

打印错误原因

当前页面正在处于跳转状态,请稍后再进行跳转.... 

....返回未登录时,需要跳转到登录授权页,此时就会出现以上报错信息,使用微信API就不会报错了

可以说困扰一天了。。。

		wx.redirectTo({
			url: "/pages/login/login",
		})

;