本文實例講述了微信小程序封裝的HTTP請求。分享給大家供大家參考,具體如下:

專注于為中小企業(yè)提供做網(wǎng)站、成都網(wǎng)站建設服務,電腦端+手機端+微信端的三站合一,更高效的管理,為中小企業(yè)泌陽免費做網(wǎng)站提供優(yōu)質的服務。我們立足成都,凝聚了一批互聯(lián)網(wǎng)行業(yè)人才,有力地推動了上千余家企業(yè)的穩(wěn)健成長,幫助中小企業(yè)通過網(wǎng)站建設實現(xiàn)規(guī)模擴充和轉變。
微信小程序里自己封裝了請求的函數(shù),但幾乎每個頁面都要用到,所以為什么更方便的調用,再一次進行封裝。
在app.js里面定義個全局對象,這樣想要用到該函數(shù),只需要在該頁面的js文件里面,請求一個app實例。
廢話不多說,先上代碼:
//全局對象httpClient
httpClient:{
request:function(method,url,data){
//返回一個promise實例
return new Promise( (resolve,reject)=>{
wx.request({
url:url,
data:data,
mehtod:method,
success:function(res){
resolve(res)
},
fail:function(res){
reject(res);
},
complete:function(){
console.log('complete');
}
})
})
}
//get方法:用來獲取數(shù)據(jù)
get:function( url ) {
return this.request('GET',url);
},
//post方法:用來更新數(shù)據(jù)
post:function( url,data) {
resturn this.request('POST',url,data);
},
//put方法
put:function(url,data){
return this.request('PUT', url, data);
},
//delete方法
delete:function(url,data){
return this.request('DELETE', url, data);
}
在需要請求的頁面調用:
例如:登錄頁面login.js
//獲取app實例,從而調用全局對象的函數(shù)
var app=getApp();
login:function(){
var url='http:xxxxx/login';
var data={
userName:'xxxxx',
passwd:'xxxxxx'
}
app.httpClient.post( url,data )
.then( res=>{console.log("請求成功時調用該函數(shù)")})
.catch(res=>{console.log("請求失敗時調用該函數(shù)")})
}
//為了更好的閱讀,也可以將回調函數(shù),定義在外面
//這樣
loginSuccess:function(){
console.log("請求成功時調用該函數(shù)")
},
loginFail:function(){
console.log("請求失敗時調用該函數(shù)")
},
login:function(){
var self=this;
var url='http:xxxxx/login';
var data={
userName:'xxxxx',
passwd:'xxxxxx'
}
app.httpClient.post( url,data )
.then( res=>self.loginSuccess())
.catch(res=>self.loginFail())
}
是不是簡潔多了。。。。
附:升級版
上代碼
// 該函數(shù)怎么寫,需要跟后端人員協(xié)商返回的格式
function getErrorMsgByErrorNo(error_no) {
let error_msg;
switch (error_no) {
case 100: error_msg = '操作失敗,請稍后再試!'; break;
default: error_msg = '網(wǎng)絡錯誤,請稍后再試!'; break;
}
return error_msg;
}
function handleData(res) {
if (res.data.success) {
if (typeof (res.data.body) === 'string') {
return [];
} else if (Array.isArray(res.data.body) === false) {
const _arr = [];
_arr.push(res.data.body);
return _arr;
} else {
return res.data.body;
}
} else {
if (res.data.error_no) {
return {
error_no: res.data.error_no,
error_msg: getErrorMsgByErrorNo(res.data.error_no)
};
} else {
return {
error_no: 123456,
error_msg: '使用
function getMyselfData() {
const _Url= urls.url;
return httpClient.get(_Url);
}
getData() {
let resultsData = this.getMyselfData();
resultsData.then((res) => {
if (res.error_no) {
// 只要有error_no就說明請求出現(xiàn)了錯誤
this.toast.showToast({
type: 'fail',
title: res.error_msg,
})
} else {
this.setData({
journeyList: res.data
})
}
});
},
希望本文所述對大家微信小程序開發(fā)有所幫助。
標題名稱:微信小程序封裝的HTTP請求示例【附升級版】
URL分享:http://www.chinadenli.net/article26/iiiocg.html
成都網(wǎng)站建設公司_創(chuàng)新互聯(lián),為您提供建站公司、企業(yè)建站、品牌網(wǎng)站設計、手機網(wǎng)站建設、小程序開發(fā)、關鍵詞優(yōu)化
聲明:本網(wǎng)站發(fā)布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經(jīng)允許不得轉載,或轉載時需注明來源: 創(chuàng)新互聯(lián)