基于uni.app封装api接口请求,含请求拦截器响应拦截器

一、创建request.js 文件(api文件夹=>request.js)

//配置基础地址
const BASE_URL = 'xxx'

//默认请求头 
const acquiesceContenttype = 'application/x-www-form-urlencoded'

export default {
	config: {
		// 请求拦截器
		beforeRequest(options = {}) {
			// console.log('请求拦截器', options)
			return new Promise((resolve, reject) => {
				options.url = BASE_URL + options.url;
				options.method = options.method || 'GET';
				options.data = options.data;
				options.timeout = options.timeout || 60000; //接口请求超时时间设置
				// 请求头携带参数
				options.header = {
					'Content-Type': options.responseType ? options.responseType : acquiesceContenttype,
				}
				resolve(options)
			})
		},
		// 响应拦截器
		handleResponse(data) {
			return new Promise((resolve, reject) => {
				const [err, res] = data;
				console.log('响应拦截器', err, res)
				if (err) {
					// console.log('接口请求超时', err)
					return reject(err);
				} else if (res) {
					if ( res.data.code == 0) {
						//接口正常
						return resolve(res.data);
					} else {
						//接口其他状态码
						return reject(res.data)
					}
				}
			})
		},
	},
	// request 请求
	request(options = {}) {
		return this.config.beforeRequest(options).then(opt => {
			return uni.request(opt)
		}).then(res => {
			return this.config.handleResponse(res)
		})
	}
}

二、创建basics.js(api文件夹=>basics.js),统一放置api处

//封装api请求方法
import api from "@/api/request.js";
//公共接口
//登录接口
export async function login(data) {
    return await api.request({
        url: 'xxxx',  //接口地址
        method: 'post',
        data: data,
    })
}

三、页面中使用

//引入
import { login } from '@/api/basics.js'
	....
	//接口调用
	login({
			...参数
		}).then(res => {
			console.log('登录', res)	
		}).catch((err) => {
			console.log('登录失败', err)	
		})