自游互动本篇文章记录微信小程序如何对wx.request进行封装实现http请求，如何实现同步请求
小程序的开发文档提供了相对实用的api wx.request() 但是我们把他封装一下，做成一个符合自己使用习惯的方式。
先上我封装好的代码吧
function myrequest(url, method,param, successCallback, failCallback) {
console.log('准备发起请求 :>> ', url);
var _this = this;
wx.request({
url: url,
data: param,
dataType: 'json',
method: method,
header: {
'custom-header': method,
'content-type': 'application/json'
},
success: (res) => {
if (successCallback) {
successCallback(res);
}
},
fail: (res) => {
console.log(res)
if (failCallback) {
failCallback(res);
}
}
});
}
export default {
get:function(url, param, success, fail) {
return myrequest(url,"GET",param,success,fail)
},
getSync:function(url, param){
return new Promise((resolve,reject)=>{
return myrequest(url,"GET",param,resolve,reject)
})
},
post:function(url, param, success, fail){
return myrequest(url,"POST",param,success,fail)
},
postSync:function(url, param, success, fail){
return new Promise((resolve,reject)=>{
return myrequest(url,"POST",param,resolve,reject)
})
},
put:function(url, param, success, fail){
return myrequest(url,"PUT",param,success,fail)
},
putSync:function(url, param, success, fail){
return new Promise((resolve,reject)=>{
return myrequest(url,"PUT",param,resolve,reject)
})
},
delete:function(url, param, success, fail){
return myrequest(url,"DELETE",param,success,fail)
},
deleteSync:function(url, param, success, fail){
return new Promise((resolve,reject)=>{
return myrequest(url,"DELETE",param,resolve,reject)
})
}
}
方法说明:
支持get、post、delete、put
同步方法:getSync、postSync、deleteSync、putSync
如何引用
我是把引用放在app.js里了 ，省去了每个页面引用都弄半天路径的问题
//app.js文件顶部加上此代码. 我的目录结构是app.js 与utils文件夹是同一目录
import ajax from '/utils/ajax.js';
//其它代码
.......
.......
globalData: { userInfo: null },
//我在globalData 加了一个属性 http: ajax
使用页面调用方式，page顶部加上如下代码
var app = getApp();
然后就可以再想用的地方用了
var param={
name:"这是名字",
id:123123
}
app.http.get(
"http://192.168.0.109:8003/api/user/sdfs",
param,
res=>{
console.log('成功了 :>> ', res);
},
er=>{
console.log('失败了 :>> ', er);
})
同步请求的方法
app.http.getSync("http://192.168.0.109:8003/api/user/ceshi",null)
.then((a,b)=>{
console.log('object :>> ', a,b);
console.log('结束了 :>> ');
console.log('发起下一次请求 ');
return app.http.getSync("http://192.168.0.109:8003/api/user/ceshi",null)
}).then(a=>{
//第二次请求的结果
console.log("a",a)
console.log('结束了 :>> ');
})