微信小程序中如何封装api接口

加粗样式
小程序中封装api接口流程图

二.域名配置
一定要配置https,小程序上配置的域名必须是域名备案的
三、打开微信开发者工具，打开你的项目，点开详情。确认一下域名是否一一匹对。不然会编译失败的哦

四，在你的项目中创建一个文件夹http，在里面在创建一个env.js，api.js和request.js（可以自己定义）
1.在env.js里边写
//设置公共访问url，即环境地址
//commonJS写法–node采用就是该规范 引入require
module.exports={
//开发环境
dev:{
baseUrl:“http://localhost:3000”
},
//测试环境
test:{
baseUrl:“http://www.text.com”
},
//线上url
prod:{
baseUrl:“https://api.it120.cc”
}
}
五. 在request.js里，二次封装wx.request
先要引入env中的url
const {baseUrl}=require(’./env.js’).prod
写它的专用域名，二次封装wx.request，拼接它需要拼接的参数
// 专用域名
const subDomain=‘lyr’;
module.exports={
// 二次封装wx.request
// {String }url:请求的接口地址
// {String} method:请求方式 GET,POST…
// {Object} data:要传递的参数
// { boolean }isSubDomain:表示是否添加二级子域名 true代表添加,false代表不添加

//二次封装wx.request
request:(url,method,data,isSubDomain)=>{
return new Promise((resolve,reject)=>{
console.log(‘这是我封装的ajax请求’,baseUrl);
// https://api.it120.cc/rmyy/shop/goods/list
// 拼接
let _url=${baseUrl}/${isSubDomain?subDomain:''}${url};
// console.log(_url)
wx.request({
url:_url,
data:data,
method:method,
header:{
‘content-type’:’ application/x-www-form-urlencoded’
},
success:res=>{
// console.log(‘获取数据’,res)
// let {code}=res.data;
resolve(res.data)
}
})
})
}
}
六，在api.js写它的数据请求
** 引入封装request请求**
const {request}=require(’./request.js’);
// 基于业务封装的数据请求
module.exports={
例如: 封装商品列表
getList:()=>{
// console.log(“获取商品列表方法”)
return request("/shop/goods/list",“POST”,{},true);
},
}
七.在index.js调用
const {getList}=require(’…/…/http/api.js’);
//引用我们要调用的方法
/*** 生命周期函数–监听页面加载*/
onLoad: function () {
// 调用方法
getList().then(res => {
this.setData({
goods_list: res.data
})
})
}