[小程序开发] 设置request封装请求参数

一、在类中定义实例属性，用来设置默认请求参数

defaults={
		baseURL:'',//请求基准地址
		url:'',//接口的请求路径
		data:null,//请求参数
		method:'GET',//默认的请求方法
		//请求头
		header:{
			'Content-type':'application/json'//设置数据的交互格式
		},
		timeout:60000//默认的超时时长，小程序默认的超时时长是1分钟
	}

二、 在实例化时传入的参数，会被constructor形参进行接收

constructor(params={}){
		// 通过Object.assign方法合并请求参数
		// 注意：需要传入的参数，覆盖默认的参数，因此传入的参数需要放到最后
		this.defaults = Object.assign({},this.defaults,params)
	}

 三、在 request实例方法中合并参数

        // 需要先合并完整的请求地址(baseURL+url)
		options.url = this.defaults.baseURL + options.url
		// 合并请求参数
		options={...this.defaults,...options}

四、在实例化时传递参数

const instance = new WxResquest({
	baseURL:'https://blog.csdn.net',
	timeout:15000
})

五、完整代码

        1、封装代码

// 创建WxResquest类
// 通过类的方式来进行封装，会让代码更具有复用性，也可以方便添加新的属性和方法
class WxResquest{

	// 定义实例属性，用来设置默认请求参数
	defaults={
		baseURL:'',//请求基准地址
		url:'',//接口的请求路径
		data:null,//请求参数
		method:'GET',//默认的请求方法
		//请求头
		header:{
			'Content-type':'application/json'//设置数据的交互格式
		},
		timeout:60000//默认的超时时长，小程序默认的超时时长是1分钟
	}

	// 用于创建和初始化类的属性以及方法
	// 在实例化时传入的参数，会被constructor形参进行接收
	constructor(params={}){
		// 通过Object.assign方法合并请求参数
		// 注意：需要传入的参数，覆盖默认的参数，因此传入的参数需要放到最后
		this.defaults = Object.assign({},this.defaults,params)
	}
	// request实例方法接收一个对象类型的参数，属性值和wx.request方法调用时传递的参数保持一致
	request(options){

		// 需要先合并完整的请求地址(baseURL+url)
		options.url = this.defaults.baseURL + options.url
		// 合并请求参数
		options={...this.defaults,...options}

		// 需要使用Promise封装wx.request，处理异步请求
		return new Promise((resolve,reject)=>{
			wx.request({
			  ...options,
			//   当接口调用成功时会触发success回调函数
			  success:(res)=>{
				  resolve(res)
			  },
			//   当接口调用失败时会触发fail回调函数
			  fail:(err)=>{
				  reject(err)
			  }
			})
		})
	}
}

// 以下是实例化代码
// 目前写到一个文件中，是为了方便进行测试，以后会提取成多个文件

// 对WxResquest进行实例化
const instance = new WxResquest({
	baseURL:'https://blog.csdn.net',
	timeout:15000
})

// 将WxResquest实例进行暴露出去，方便再其他文件中进行使用
export default instance

        2、调用代码

// pages/test/test.js
import instance from '../../utils/request'
Page({
    async handler(){
        const res = await instance.request({
            url:"/Hang_Q?spm=1000.2115.3001.5343",
            method:'GET'
        })
        console.log(res)
    }
})