Latar Belakang
Kod applet sebelumnya mengelirukan, jadi kami merancang untuk merangkum permintaan applet WeChat dari permulaan projek baharu
Proses
Mari kita bincangkan keseluruhan proses dahulu:
1.appjs Setelah dimasukkan, dapatkan maklumat pengguna Jika anda tidak log masuk, anda akan log masuk secara lalai. Tiada pengendalian ralat dilakukan di sini
2. Pengguna mesti bersetuju dengan kebenaran sebelum operasi boleh dilakukan Jika dia tidak bersetuju dengan kebenaran, dia akan sentiasa melompat ke halaman kebenaran
3. Selepas mengklik Kebenaran untuk log masuk pada halaman kebenaran, hubungi antara muka log masuk Selepas berjaya, kembali ke halaman di mana kebenaran itu digunakan ,app.js
Dapatkan maklumat pengguna dalam onLaunch
.appSelf?=?this; ????????//?應用程序第一次進入,獲取用戶信息,不做任何錯誤處理 ????????userInfo().then(?(res)=>{ ????????????console.log(res);//?打印結果 ????????????if?(!res.code)?{ ????????????????appSelf.globalData.userInfo?=?res ????????????} ????????}).catch(?(errMsg)=>{ ????????????console.log(errMsg);//?錯誤提示信息 ????????});
httpUtils.js
minta enkapsulasi
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({//后臺請求 ????????????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"); ????????????} ????????}); ????}); }
log masuk
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; ????????????????//?已經授權,可以直接調用?getUserInfo?獲取頭像昵稱,不會彈框 ????????????????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)?{ ????????????????????????????//?跳轉授權頁面 ????????????????????????????wx.navigateTo({ ????????????????????????????????url:?'/pages/auth/auth' ????????????????????????????}) ????????????????????????????return; ????????????????????????} ????????????????????????wx.getSetting({ ????????????????????????????success:?(res)?=>?{ ????????????????????????????????if?(!res.authSetting["scope.userInfo"])?{ ????????????????????????????????????//?跳轉授權頁面 ????????????????????????????????????wx.navigateTo({ ????????????????????????????????????????url:?'/pages/auth/auth' ????????????????????????????????????}) ????????????????????????????????} ????????????????????????????} ????????????????????????}); ????????????????????} ????????????????}) ????????????} ????????}) ????}); };
auth.js
Halaman kebenaran 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);//?打印結果 ????????????????if?(res.code)?{ ????????????????????//?接口錯誤 ????????????????????return ????????????????} ????????????????//?跳轉回上一個頁面 ????????????????wx.navigateBack() ????????????}).catch(?(errMsg)=>{ ????????????????console.log(errMsg);//?錯誤提示信息 ????????????}); ????????} ????}, });
Alamat projek
https://github.com/lmxdawn/wx.. .
Pengurusan belakang yang dibina oleh vue thinkphp5.1: https://github. com/lmxdawn/vu...
Demo: <br>