一.
請求后臺的時候宫补，服務端對每一個請求都會驗證權限鞍陨，而前端也需要對服務器返回的特殊狀態(tài)碼統(tǒng)一處理噪猾，所以可以針對業(yè)務封裝請求。
首先我們通過request攔截器在每個請求頭里面塞入token等信息脐湾，好讓后端對請求進行權限驗證。并創(chuàng)建一個respone攔截器叙淌，當服務端返回特殊的狀態(tài)碼秤掌，我們統(tǒng)一做處理愁铺，如未登錄網(wǎng)絡錯誤等操作。
二.
- 首先了解小程序官方api-wx.request()闻鉴，通過示例可以看出wx.request的參數(shù)是一個對象茵乱，擁有傳輸?shù)刂罚瑐鬏攦?nèi)容孟岛，響應頭瓶竭，成功失敗回調函數(shù)等屬性和方法，我們可以通過封裝相應的響應頭和成功失敗回調函數(shù)達到相應的目的：
// 官方代碼示例
wx.request({
url: 'test.php', //僅為示例渠羞，并非真實的接口地址
data: {
x: '',
y: ''
},
header: {
'content-type': 'application/json' // 默認值
},
success (res) {
console.log(res.data)
}
fail(res){
console.log(res)
}
})
2.封裝
封裝請求頭和返回的狀態(tài)碼（注：具體頭需要添加哪些屬性斤贰，返回的狀態(tài)碼處理，是根據(jù)與后臺實際溝通所需的參數(shù)來制定的）
const app = getApp();
const appid = 'xxxx';
const appSecret = 'xxxxxx';
let ajaxNum = 0;
// 獲取accessToken
function getAccessToken(callback) {
wx.request({
url: '/api/Token',
data: {
appid: aesEncrypt(appid),// aesEncrypt():自定義的用crypto-js.js進行aes加密的方法,這里只需要知道加密了即可次询，不需要關注此方法
appSecret: aesEncrypt(appSecret),
},
success: function (res) {
if(res.statusCode ===200 && res.data.code === 0) {
let accesstoken = res.data.data.accesstoken;
if (typeof (callback) === 'function' && accesstoken) {
callback(accesstoken);
}
}
},
})
}
// 封裝request請求
const myRequest = options => {
if(options) {
getAccessToken(function (accesstoken){
// header 設置Content-Type荧恍，accesstoken, usertoken, noncestr, timestamp等信息，與后臺協(xié)商好
if(options.header === undefined || options.header === null) {
options.header = {};
}
options.header['Content-Type'] = 'application/x-www-form-urlencoded; charset=UTF-8';
// usertoken在登錄后保存在緩存中屯吊，所以從緩存中取出送巡，放在header
let usertoken = wx.getStorageSync('usertoken');
if (usertoken) {
options.header['usertoken'] = usertoken;
}
// 自定義getNoncestr()設置隨機字符串，getTimestamp()獲取時間戳
let noncestr = getNoncestr();
let timestamp = getTimestamp();
// sign進行加密
let sign = getSign(accesstoken, appid, appSecret, noncestr, timestamp);
if (timestamp) {
options.header['timestamp'] = timestamp;
}
if (noncestr) {
options.header['noncestr'] = noncestr;
}
if (sign) {
options.header['sign'] = sign;
}
//url
let baseUrl = config.BASE_HOST;
if (options.url.indexOf('http') != 0) {
options.url = baseUrl + options.url;
}
// method盒卸、data
if (options.method === undefined || options.method === null) {
options.method = 'post';
}
if (options.method.toLowerCase() === 'post') {
if(options.data) {
let dataStr = JSON.stringify(options.data);
let base64Str = base64Encrypt(dataStr);
options.data = serializeData({ param: base64Str });
}
}
//success
if (options.success && typeof(options.success) === 'function') {
let successCallback = options.success;
options.success = function(res) {
// 判斷不同的返回碼 200/404
if (res.statusCode === 200) {
try {
// 接收的后臺數(shù)據(jù)用自定義base64解密方法解密后轉為對象
let str = base64Decrypt(res.data);
let data = JSON.parse(str);
if (parseInt(data.resultCode, 10) === -1) {//后臺商議好的狀態(tài)碼骗爆，-2未登錄，-1-3后臺出錯
console.error('網(wǎng)絡超時世落，請稍后重試');
} else if (parseInt(data.resultCode, 10) === -3) {
console.error(data.msg);
} else if (parseInt(data.resultCode, 10) === -2){
console.log("用戶未登錄-ajax");
}
res.data = data;
//調用自定義的success
successCallback(res);
} catch (e) {
console.error('出錯了淮腾，' + e + ',接口返回數(shù)據(jù):' + res.data);
}
} else if(res.statusCode === 404) {
console.log('404');
}
}
}
//執(zhí)行微信的請求
wx.request(options);
});
}
}
module.exports = {
myRequest: myRequest
}
頁面調用示范（與wx.request傳參一致）：
const ajax = require('ajax.js');
ajax.javaRequest({
url: '/xxx',
data: {
xxxx: xxx
},
method: 'POST',
success: res => {
console.log(res, '成功')
}
})
