這篇文章主要講解了“小程序request封裝的詳細(xì)流程”，文中的講解內(nèi)容簡(jiǎn)單清晰，易于學(xué)習(xí)與理解，下面請(qǐng)大家跟著小編的思路慢慢深入，一起來(lái)研究和學(xué)習(xí)“小程序request封裝的詳細(xì)流程”吧！
公司主營(yíng)業(yè)務(wù)：網(wǎng)站設(shè)計(jì)、網(wǎng)站建設(shè)、移動(dòng)網(wǎng)站開(kāi)發(fā)等業(yè)務(wù)。幫助企業(yè)客戶(hù)真正實(shí)現(xiàn)互聯(lián)網(wǎng)宣傳，提高企業(yè)的競(jìng)爭(zhēng)能力。創(chuàng)新互聯(lián)建站是一支青春激揚(yáng)、勤奮敬業(yè)、活力青春激揚(yáng)、勤奮敬業(yè)、活力澎湃、和諧高效的團(tuán)隊(duì)。公司秉承以“開(kāi)放、自由、嚴(yán)謹(jǐn)、自律”為核心的企業(yè)文化，感謝他們對(duì)我們的高要求，感謝他們從不同領(lǐng)域給我們帶來(lái)的挑戰(zhàn)，讓我們激情的團(tuán)隊(duì)有機(jī)會(huì)用頭腦與智慧不斷的給客戶(hù)帶來(lái)驚喜。創(chuàng)新互聯(lián)建站推出察哈爾右翼前免費(fèi)做網(wǎng)站回饋大家。
之前小程序代碼混亂，所以新項(xiàng)目一開(kāi)始就準(zhǔn)備弄個(gè)微信小程序的 request 的封裝
先來(lái)說(shuō)說(shuō)整個(gè)流程：
1.appjs 里面已進(jìn)入就去獲取用戶(hù)信息，如果沒(méi)有登錄則默認(rèn)登錄，這里不做錯(cuò)誤處理
2.用戶(hù)必須同意授權(quán)才能進(jìn)行操作，如果不同意授權(quán)則會(huì)一直跳轉(zhuǎn)到授權(quán)頁(yè)面
undefined
onLaunch 里面獲取用戶(hù)信息
重慶分公司
重慶分公司
appSelf = this;
// 應(yīng)用程序第一次進(jìn)入，獲取用戶(hù)信息，不做任何錯(cuò)誤處理
userInfo().then( (res)=>{
console.log(res);// 打印結(jié)果
if (!res.code) {
appSelf.globalData.userInfo = res
}
}).catch( (errMsg)=>{
console.log(errMsg);// 錯(cuò)誤提示信息
});const request = function (path, method, data, header) {
let user_id = "";
let token = "";
try {
user_id = wx.getStorageSync(USER_ID_KEY);
token = wx.getStorageSync(TOKEN_KEY);
} catch (e) {}
header = header || {};
let cookie = [];
cookie.push("USERID=" + user_id);
cookie.push("TOKEN=" + token);
cookie.push("device=" + 1);
cookie.push("app_name=" + 1);
cookie.push("app_version=" + ENV_VERSION);
cookie.push("channel=" + 1);
header.cookie = cookie.join("; ");
return new Promise((resolve, reject) => {
wx.request({//后臺(tái)請(qǐng)求
url: API_BASE_URL + path,
header: header,
method: method,
data: data,
success: function (res) {
if (res.statusCode !== 200) {
reject(res.data)
} else {
if (res.data.code === 20006) {
login().then( (res)=>{
resolve(res)
}).catch( (errMsg)=>{
reject(errMsg);
})
}
resolve(res.data)
}
},
fail: function (res) {
reject("not data");
}
});
});
}const login = function () {
try {
wx.removeStorageSync(USER_ID_KEY)
wx.removeStorageSync(TOKEN_KEY)
} catch (e) {}
return new Promise((resolve, reject) => {
wx.login({
success: res => {
let code = res.code;
// 已經(jīng)授權(quán)，可以直接調(diào)用 getUserInfo 獲取頭像昵稱(chēng)，不會(huì)彈框
wx.getUserInfo({
withCredentials: true,
success: res => {
let userInfo = res.userInfo;
let name = userInfo.nickName;
let avatar = userInfo.avatarUrl;
let sex = userInfo.gender;
let data = {
code: code,
encryptedData: res.encryptedData,
iv: res.iv,
name: name,
avatar: avatar,
sex: sex,
from: FROM,
};
request("/api/user/login/byWeChatApplet", "POST", data).then( (res)=>{
if (!res.code) {
try {
wx.setStorageSync(USER_ID_KEY, res.user_id);
wx.setStorageSync(TOKEN_KEY, res.token)
} catch (e) {
reject(JSON.stringify(e));
}
}
resolve(res)
}).catch( (errMsg)=>{
reject(errMsg)
});
},
fail: function (res) {
console.log(res);
if (res.errMsg && res.errMsg.startsWith("getUserInfo:fail") && res.errMsg.search("unauthorized") != -1) {
// 跳轉(zhuǎn)授權(quán)頁(yè)面
wx.navigateTo({
url: '/pages/auth/auth'
})
return;
}
wx.getSetting({
success: (res) => {
if (!res.authSetting["scope.userInfo"]) {
// 跳轉(zhuǎn)授權(quán)頁(yè)面
wx.navigateTo({
url: '/pages/auth/auth'
})
}
}
});
}
})
}
})
});
};授權(quán)頁(yè)面 js
Page({
data: {
},
onLoad: function () {
self = this;
},
auth: function (e) {
console.log(app.globalData.userInfo);
if (e.detail.userInfo) {
login().then( (res)=>{
console.log(res);// 打印結(jié)果
if (res.code) {
// 接口錯(cuò)誤
return
}
// 跳轉(zhuǎn)回上一個(gè)頁(yè)面
wx.navigateBack()
}).catch( (errMsg)=>{
console.log(errMsg);// 錯(cuò)誤提示信息
});
}
},
});感謝各位的閱讀，以上就是“小程序request封裝的詳細(xì)流程”的內(nèi)容了，經(jīng)過(guò)本文的學(xué)習(xí)后，相信大家對(duì)小程序request封裝的詳細(xì)流程這一問(wèn)題有了更深刻的體會(huì)，具體使用情況還需要大家實(shí)踐驗(yàn)證。這里是創(chuàng)新互聯(lián)，小編將為大家推送更多相關(guān)知識(shí)點(diǎn)的文章，歡迎關(guān)注！
