前言
微信小程序是數(shù)據(jù)驅(qū)動(dòng)的應(yīng)用,開(kāi)發(fā)技術(shù)和vue、react和angular等mv*技術(shù)類(lèi)似。在vue下可以用vue-resource、axios等模塊進(jìn)行http請(qǐng)求,但是在微信小程序上,http請(qǐng)求只支持wx.request(OBJECT),所以我們需要對(duì)wx.request進(jìn)行封裝,實(shí)現(xiàn)http攔截器的功能。
第一步:創(chuàng)建一個(gè)request.js文件
第二步:確定http、upload和websocket前綴
第三步:封裝wx.request
在請(qǐng)求發(fā)出前處理http地址、請(qǐng)求頭和參數(shù)、在響應(yīng)后解析返回值并做基本的邏輯判斷,重點(diǎn)是使用Promise對(duì)象。
第四步:導(dǎo)出模塊
第五步:使用request
const Request = require("/utils/request");//導(dǎo)入模塊Request.post("/api/xcxWxLogin", { //調(diào)用方法 code: res.code, encryptedData: resp.encryptedData, iv: resp.iv, shareId: share.shareId || "", salesmanId: share.salesmanId || "", source: share.source || ""}).then(res => { //成功回調(diào) //todo}).catch(err => {}); //異常回調(diào)
第六步:攔截器完整代碼
const apiHttp = "https://*****.com";const socketHttp = "wss://*****.com/wss";function fun(url, method, data, header) {data = data || {};header = header || {};let sessionId = wx.getStorageSync("UserSessionId");if (sessionId) {if (!header || !header["SESSIONID"]) { header["SESSIONID"] = sessionId;}}wx.showNavigationBarLoading();let promise = new Promise(function(resolve, reject) {wx.request({ url: apiHttp + url, header: header, data: data, method: method, success: function(res) { if (typeof res.data === "object") { if (res.data.status) { if (res.data.status === -200) { wx.showToast({ title: "為確保能向您提供最準(zhǔn)確的服務(wù),請(qǐng)退出應(yīng)用重新授權(quán)", icon: "none" }); reject("請(qǐng)重新登錄"); } else if (res.data.status === -201) { wx.showToast({ title: res.data.msg, icon: "none" }); setTimeout(function() { wx.navigateTo({ url: "/pages/user/supplement/supplement" }); }, 1000); reject(res.data.msg); } } } resolve(res); }, fail: reject, complete: function() { wx.hideNavigationBarLoading(); }});});return promise;}function upload(url, name, filePath) {let header = {};let sessionId = wx.getStorageSync("UserSessionId"); //從緩存中拿該信息if (sessionId) {if (!header || !header["SESSIONID"]) { header["SESSIONID"] = sessionId; //添加到請(qǐng)求頭中}}wx.showNavigationBarLoading();let promise = new Promise(function(resolve, reject) {wx.uploadFile({ url: apiHttp + url, filePath: filePath, name: name, header: header, success: function(res) { resolve(res); }, fail: reject, complete: function() { wx.hideNavigationBarLoading(); }});});return promise;}module.exports = {apiHttp: apiHttp,socketHttp: socketHttp,"get": function(url, data, header) {return fun(url, "GET", data, header);},"post": function(url, data, header) {return fun(url, "POST", data, header);},upload: function(url, name, filePath) {return upload(url, name, filePath);}};
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持VEVB武林網(wǎng)。
新聞熱點(diǎn)
疑難解答
圖片精選
網(wǎng)友關(guān)注