基于uni.app封装接口请求,含请求拦截器响应拦截器
一、创建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)
})