小程序分析
封装登录功能:模板复用方式
通过 wxlogin(布尔值)状态来处理是否登录,以及显示和隐藏
检测登录状态的方法
一、 登录:
- 允许授权:
//处理允许登录的功能 processLogin(e) { console.log(‘点击允许获取用户信息:‘,e) if (!e.detail.userInfo) { wx.showToast({ title: ‘已取消‘, icon: ‘none‘, }) return; }
//调用register方法将用户信息存入后台数据库
AUTH.register(this);
},
//存入用户数据到后台数据库 async function register(page) { console.log(‘register::::‘,this) let _this = this;
//调用wx.login获取code凭证 wx.login({
success: function (res) { let code = res.code; // 微信登录接口返回的 code 参数,下面注册接口需要用到
//获取用户信息
wx.getUserInfo({
success: function (res) {
console.log(‘wx.getUserInfo:‘,res)
let iv = res.iv;
let encryptedData = res.encryptedData;
let referrer = ‘‘ // 推荐人
let referrer_storge = wx.getStorageSync(‘referrer‘);
if (referrer_storge) {
referrer = referrer_storge;
}
// 下面开始调用注册接口,写入后台数据库
//接口文档:https://api.it120.cc/doc.html#/%E5%89%8D%E7%AB%AFapi%E6%8E%A5%E5%8F%A3%E6%96%87%E6%A1%A3/%E5%BE%AE%E4%BF%A1%E5%B0%8F%E7%A8%8B%E5%BA%8F/registerComplexUsingPOST_15
WXAPI.register_complex({
code: code,
encryptedData: encryptedData,
iv: iv,
referrer: referrer
}).then(function (res) {
//写入数据库成功后,调用自己封装的login方法
_this.login(page);
})
}
})
}
}) }
//login登录方法,从后台数据库读取用户写,并onshow重新展示
async function login(page){ const _this = this wx.login({ success: function (res) { console.log(‘开始登录啦!‘,res) WXAPI.login_wx(res.code).then(function (res) {
console.log(‘获取code‘,res)
if (res.code == 10000) { // 去注册 //_this.register(page) return; } if (res.code != 0) { // 登录错误 wx.showModal({ title: ‘无法登录‘, content: res.msg, showCancel: false }) return; } wx.setStorageSync(‘token‘, res.data.token) wx.setStorageSync(‘uid‘, res.data.uid) if ( page ) { page.onShow() } }) } }) }
2.// 检测登录状态,返回 true / false async function checkHasLogined() { const token = wx.getStorageSync(‘token‘) if (!token) { return false } const loggined = await checkSession() if (!loggined) { wx.removeStorageSync(‘token‘) return false } const checkTokenRes = await WXAPI.checkToken(token) if (checkTokenRes.code != 0) { wx.removeStorageSync(‘token‘) return false } return true }
-
获取用户信息: _this.getUserApiInfo();
//获取登录后的用户信息 getUserApiInfo: function () { var that = this;
//获取用户信息,当然可以自己封装userDetail接口来获取 WXAPI.userDetail(wx.getStorageSync(‘token‘)).then(function (res) { console.log(‘用户详情:::‘,res); if (res.code == 0) { let _data = {} _data.apiUserInfoMap = res.data if (res.data.base.mobile) { _data.userMobile = res.data.base.mobile } if (that.data.order_hx_uids && that.data.order_hx_uids.indexOf(res.data.base.id) != -1) { _data.canHX = true // 具有扫码核销的权限 } that.setData(_data); } })
展现到个人中心的页面上(包括用户名和头像)
4.登录后获取个人资产: _this.getUserAmount();
//封装用户个人资产方法(包括余额,积分。。。。。) getUserAmount: function () { var that = this;
//调用封装的获取用户信息的请求接口,也可自己按照咱们自己的封装去请求
WXAPI.userAmount(wx.getStorageSync(‘token‘)).then(function (res) {
console.log(‘用户‘,res)
if (res.code == 0) {
that.setData({
balance: res.data.balance.toFixed(2), //处理成保留两位小数的余额
freeze: res.data.freeze.toFixed(2),
score: res.data.score,
growth: res.data.growth
});
}
})
}
退出登录:
loginOut(){
//清缓存
AUTH.loginOut()
//跳转到我的页面
wx.reLaunch({
url: ‘/pages/my/index‘
})
}