一键登录和手机号登录差不多,只不过需要先通过特殊的 button 标签,获取到加密后的手机号,后面和手机号登录是一样的。
首先,需要有一个 button 标签:
<button type="primary" open-type="getPhoneNumber" @getphonenumber="getUserPhone" lang="zh_CN" class="touch_btn">微信用户一键登录</button>
open-type=”getPhoneNumber” 这个按钮允许用户授权小程序获取他们的手机号码。
如果用户同意授权,微信会将加密的手机号信息发送给前端(在@getphonenumber 回调中拿到)
然后,调用 uni.login 获取 code,通过 code 调用后端接口获取 openid,调用登录接口,传入 openid,加密的手机号,得到 token。
总结下流程:
- 输入手机号,调用后端接口,获取验证码
- 点击登录。调用 uni.login 获取 code,通过 code 调用后端接口获取 openid,调用登录接口,传入 openid,手机号,验证码,得到 token
getUserPhone(obj) {
const desPhone = obj.code
uni.login({
success: (res) => {
// 拿到code
const code = res.code
// 拿到openid
const openid = this.handelGetOpenId(code)
// 调用登录接口
this.handelSubmit(openid, desPhone)
}
})
}