微信小程序中如何封装api接口 - 新闻资讯 - 云南小程序开发|云南软件开发|云南网站建设-昆明葵宇信息科技有限公司

159-8711-8523

云南网建设/小程序开发/软件开发

知识

不管是网站,软件还是小程序,都要直接或间接能为您产生价值,我们在追求其视觉表现的同时,更侧重于功能的便捷,营销的便利,运营的高效,让网站成为营销工具,让软件能切实提升企业内部管理水平和效率。优秀的程序为后期升级提供便捷的支持!

您当前位置>首页 » 新闻资讯 » 小程序相关 >

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

发表时间:2020-10-5

发布人:葵宇科技

浏览次数:30

加粗样式
小程序中封装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’);
//引用我们要调用的方法
/*** 生命周期函数–监听页面加载*/
rel="stylesheet">

相关案例查看更多