本项目使用的是mpvue(使用微信小程序原生开发一个道理)
在app.vue文件create钩子函数里:
// 主要是为了获取code
wx.login({
success (res) {
if (res.code) {
// 封装的缓存方法
that.$wxhttp.cache('code', res.code)
} else {
console.log('登录失败!' + res.errMsg)
}
}
})
// 获取用户的当前设置。本项目里判断用户是否已授权登录
wx.getSetting({
success (res) {
if (res.authSetting['scope.userInfo']) {
wx.getUserInfo({
success: function (res) {
// 如果用户已经授权则会调用该方法
that.$wxhttp.authSuccessReq(res)
}
})
} else {
console.error('用户没有授权')
}
}
})
// 从后台获取openid等参数信息
function authSuccessReq (data) {
return new Promise((resolve, reject) => {
if (!wx.getStorageSync('userInfo').openid) {
wx.request({
url:'',
method: 'POST',
data: {
encryptedData: data.encryptedData,
code: wx.getStorageSync('code'),
iv: data.iv,
},
success: function (info) {
let userInfo = data.userInfo
。。。。。
resolve(userInfo)
},
fail (res) {
reject(res)
}
})
} else {
resolve(wx.getStorageSync('userInfo'))
}
})
}
如果用户还没有登录过,则
<button v-if="!auth" open-type="getUserInfo" @getuserinfo="getUserInfo">立即预约</button>
<button v-else form-type="submit">立即预约</button>
如果没有登录则用open-type=“getUserInfo” 如果已经登录过则用普通的button。auth是用来判断是否登录的
登录成功后会在getUserInfo方法中继续调用authSuccessReq方法获取openid