前言
我們?cè)谠崎_發(fā)過程中使用云函數(shù)宠蚂,在請(qǐng)求前會(huì)做一點(diǎn)通用的事情(顯示Loading)乓土,不可能每次都寫,太麻煩了似枕。
但是很多同學(xué)已經(jīng)完成了項(xiàng)目盖淡,如果重新使用新的封裝請(qǐng)求,會(huì)改很多地方凿歼,所以為了方便褪迟,我重寫了微信的callFunction方法
代碼
let callFunction = wx.cloud.callFunction
//全局請(qǐng)求遮罩
var needLoadingRequestCount = 0;
function showFullScreenLoading() {
if (needLoadingRequestCount === 0) {
wx.showLoading({
title: '加載中',
mask: true,
icon: 'none'
})
}
needLoadingRequestCount++;
};
function tryHideFullScreenLoading() {
needLoadingRequestCount--;
if (needLoadingRequestCount === 0) {
wx.hideLoading();
}
};
//攔截器
let interceptors = {
request: {
interceptors: [],
use(fun, err) {
this.interceptors.push(fun)
},
intercept(data, reqIntercept) {
for (let i = 0; i < this.interceptors.length; i++) {
data = this.interceptors[i](data, reqIntercept) || data
}
return data
}
},
response: {
interceptors: [],
use(fun, err) {
this.interceptors.push(fun)
},
intercept(data, resIntercept) {
try {
for (let i = 0; i < this.interceptors.length; i++) {
data = this.interceptors[i](data, resIntercept)|| data
}
return data
} catch (e) {
reject(e)
}
}
}
}
interceptors.request.use((data, reqIntercept) => {
if (reqIntercept.showLoading) {
showFullScreenLoading();
}
return data
})
interceptors.response.use((data, reqIntercept) => {
if (reqIntercept.showLoading) {
tryHideFullScreenLoading();
}
return data
})
function asyncType(data) {
let type = 'promise'
if (['success', 'fail', 'complete'].some(item => Object.keys(data).includes(item))) {
type = 'callback'
}
return type
}
wx.cloud.callFunction = function (data, config = {
showLoading: true
}) {
data = interceptors.request.intercept(data, config)
let type = asyncType(data)
if (type == 'callback') {
if (data.complete) {
var _complete = data.complete;
}
data.complete = function (arg) {
interceptors.response.intercept(data, config)
if (_complete) {
_complete.call(this, arg);
}
}
return callFunction.call(this, data)
} else {
return callFunction.call(this, data).finally(() => {
interceptors.response.intercept(data, config)
})
}
}
module.exports = interceptors
rq.js
這個(gè)是主要工具方法,在app.js直接引入就可以了答憔。
let rq = require("./util/ajax.js");
//看個(gè)人情況使用
rq.request.use((data, config) => {
//請(qǐng)求前做的事情,校驗(yàn)登錄什么的
return data
})
rq.response.use((data, config) => {
//請(qǐng)求后做的事情
return data
})
App({
onLaunch: function () {
if (!wx.cloud) {
console.error('請(qǐng)使用 2.2.3 或以上的基礎(chǔ)庫以使用云能力')
} else {
wx.cloud.init({
env: '',
traceUser: true,
})
}
}
})
app.js
正常使用callFunction就可以了
const db = wx.cloud.database()
Page({
/**
* 我們添加了第二參數(shù)味赃,控制一些邏輯的產(chǎn)生,可以不傳
*
* showLoading:默認(rèn)為true true就是現(xiàn)實(shí)Loading 可以自行傳入false
*/
onLoad: async function () {
//1
// let res = await wx.cloud.callFunction({
// name: 'user-list'
// },{
// showLoading:true
// })
//2 和上個(gè)面的效果是一樣的
let res = await wx.cloud.callFunction({
name: 'user-list'
})
console.log(res)
}
})
index.js
后言
內(nèi)容判斷還不夠完善虐拓,如果需要更新和新功能可 @我