微信小程序接口请求封装api

1. 在utils文件夹中,新建一个文件request.js,二次封装wx.request

// params 参数
// method:请求方式,默认GET,其他有POST
// url:接口路径
// data:请求参数字典
// success:请求成功
// fail:请求失败
//项目地址
var requestUrl = 'https://www.xxxxx.cn/';//配置的域名

//接口请求封装
const httpsRequest = function(params) {
    
    
	if (params === null) {
    
    
		return requestUrl
	}
	console.log("原始请求参数", params);
	var method = "GET"
	if (params.method) {
    
    
		method = params.method;
	}
	var data = {
    
    };
	if (params.data) {
    
    
		data = params.data;
	}
	wx.request({
    
    
		url: requestUrl + params.url,
		header: {
    
    
			'Content-Type': 'application/json',
			// 'Content-Type':'application/x-www-form-urlencoded',
		},
		data: data,
		method: method,
		success: function(res) {
    
    
			console.log("请求成功", res)
			//statusCode返回接口
			if (res.statusCode != 200) {
    
    
				console.log("其他类型的https请求错误");
				if (params.fail) {
    
    
					params.fail(res)
				}else{
    
    
					uni.showToast({
    
    
						title: "请求错误" + res.statusCode,
						icon: 'none',
						duration: 2000
					})
				}
				return;
			}
			if (res.data.success) {
    
    //接口请求成功
				if (params.success) {
    
    
					params.success(res)
				}
			} else {
    
    //接口请求失败
				if (params.fail) {
    
    
					params.fail(res)
				}
			}
			return;
		},
		fail: function(res) {
    
    
			console.log("请求失败", res)
			if (params.fail) {
    
    
				params.fail(res)
			}else{
    
    
				uni.showToast({
    
    
					title: "请求异常",
					icon: 'none',
					duration: 4000
				})
			}
			return;
		},
		complete: function(res) {
    
    
			console.log("请求完成", res)
		}
	})
}

module.exports = httpsRequest;

2. 在main.js中全局引入**

import httpsRequest from '@/utils/request.js'
Vue.prototype.httpsRequest = httpsRequest

3. 在页面中使用(部分代码)

methods: {
    
    
	getInfo(){
    
    
		var _this = this
		let params = {
    
    }
		_this.httpsRequest({
    
    
			url:``,
			data:{
    
    ...params},
			method:"POST",
			success: function(res) {
    
    
				uni.showToast({
    
    
					title: '操作成功',
					icon: 'none',
					duration: 2000
				})
			},
			fail: function(err) {
    
    //可不写,不写展示默认设定错误
				uni.showToast({
    
    
					title: '操作失败',
					icon: 'none',
					duration: 2000
				})
			}
		})
	}
}

猜你喜欢

转载自blog.csdn.net/weixin_43883951/article/details/132581429