uniapp 请求封装，拦截器：请求拦截、响应拦截

最新推荐文章于 2024-10-09 14:45:17 发布

愉快的马儿

最新推荐文章于 2024-10-09 14:45:17 发布

阅读量1k

点赞数

分类专栏：前端 html 文章标签：前端 javascript 小程序

本文链接：https://blog.csdn.net/m0_67266787/article/details/123431848

版权

前端同时被 2 个专栏收录

42 篇文章 4 订阅

订阅专栏

html

42 篇文章 0 订阅

订阅专栏

目录结构：

uniapp 请求封装，拦截器：请求拦截、响应拦截

主要就是request.js和api.js文件，其他是我这边的业务需求文件。

1. 全局请求封装：`request.js`

// 全局请求封装
export default (url, method, params) => {
const token = uni.getStorageSync('token');
	uni.showLoading({
		title: "加载中"
	});
	if(!token ){
		// 执行没有登录的逻辑

		return;
	}
	return new Promise((resolve, reject) => {
		wx.request({
			url: "https://www.piop.cn/api" + url,
			method: method,
			header: {
				token: token
			},
			data: {
				serviceId: api[0].serviceId,
				...params
			},
			success(res) {
				resolve(res.data);
			},
			fail(err) {
				reject(err);
			},
			complete() {
				uni.hideLoading();
			}
		});
	});
};

说明：

uniapp 请求封装，拦截器：请求拦截、响应拦截

总之请求拦截操作就放在7-14行中间，响应拦截操作就放在success()、 fail()、 complete()函数体里。

2. 接口封装：`api.js`

import request from "./request.js"

export default {
	// 密码登录
	passwordLogin(params) {
		return request("/platform/metadata/logon", "GET", params)
	},

	// 短信登录
	noteLogin(params) {
		return request("/platform/metadata/login", "GET", params)
	},

	// 获取验证码：用于短信登陆、密码找回、用户注销
	getAuthCode(params) {
		return request("/platform/metadata/sms", "GET", params)
	},

	// 获取注册账号验证码
	getRegistAuthCode(params) {
		return request("/platform/metadata/sms1", "GET", params)
	},

	// 登录者信息
	getMyInfo(params) {
		return request("/platform/metadata/bindinfo", "GET", params)
	},

	// 注册账号
	registerAccount(params) {
		return request("/platform/metadata/register", "GET", params)
	},

	// 找回密码
	retrievePassword(params) {
		return request("/platform/metadata/back", "GET", params)
	},

	// 注销账号
	offAccount(params) {
		return request("/platform/metadata/cancel", "GET", params)
	},
	
}