uniapp小程序（请求拦截器和路由拦截器）

最新推荐文章于 2024-07-15 15:12:34 发布

DamonSalvatore18

最新推荐文章于 2024-07-15 15:12:34 发布

阅读量3.5k

点赞数 3

文章标签：大数据小程序前端

本文链接：https://blog.csdn.net/DamonSalvatore18/article/details/125431010

版权

1、路由拦截器

let config = {
	//不需要登录的页面,白名单
	whiteList: [
		"/pages/welcome/welcome",
		"/pages/getPhone/getPhone",
		"/pages/invitation_homeAll/invitation_homeAll",
		"/pages/invitation_getPhone/invitation_getPhone",
		//......
	],
	//登录页
	loginPage: "/pages/getPhone/getPhone"
}
export default function initApp() {
	/**
	 * 页面跳转拦截器
	 */
	let list = ["navigateTo", "redirectTo", "reLaunch", "switchTab"];
	list.forEach(item => { //用遍历的方式分别为,uni.navigateTo,uni.redirectTo,uni.reLaunch,uni.switchTab这4个路由方法添加拦截器
		uni.addInterceptor(item, {
			invoke(e) { // 调用前拦截
				//获取用户的token
				const token = uni.getStorageSync('token'),

					//获取要跳转的页面路径（url去掉"?"和"?"后的参数）
					url = e.url.split('?')[0];
				let notNeed = config.whiteList.includes(url)
				// 如果在whiteList里面就不需要登录
				if (notNeed) {
					return e
				} else {

					//需要登录
					if (!token) {
						uni.navigateTo({
							url: config.loginPage
						})
						return false
					} else {
						return e
					}
				}

			},
			fail(err) { // 失败回调拦截 
				console.log(err);

			}
		})
	})


}

2、请求拦截器

post(url, data, headerValue) {
		return new Promise((resolve, reject) => {
			uni.request({
				url: apiSystem + url,
				data: data,
				header: {
					'content-type': 'application/x-www-form-urlencoded', //自定义请求头信息
					'token': headerValue
				},
				method: 'POST',
			}).then((response) => {
				let [error, res] = response;
				resolve(res);


			}).catch(error => {
				let [err, res] = error;
				reject(err)

			})
			//token的请求拦截器
			uni.addInterceptor('request', {
				success(args) {

					if (args.data.code == 500 && args.data.msg == '未找到token对应的用户' || args.data.msg ==
						'header缺失：token') {
						let pages = getCurrentPages(); //获取所有页面栈实例列表
						let prevPage = pages[pages.length - 1]; //上一页页面实例
						console.log('prevPage.$page.fullPath>>' + prevPage.$page.fullPath)
						//防止多次拦截请求时，多次跳转登录页

						if (prevPage.$page.fullPath != '/pages/getPhone/getPhone') {
							uni.navigateTo({
								url: '/pages/getPhone/getPhone'
							})
							return false
						}

					}
				}
			})

		})

	},