uniapp微信小程序登录(先授权微信后授权手机号)-- (1)

1.操作流程

①点击登录按钮,实现微信授权。

②授权允许后弹出绑定手机号授权。

③手机号授权成功后,跳转回登录界面。

2.逻辑流程

①登录之前自动加载出微信的code。

②微信登录后,将获取的微信信息(昵称、头像等)以及后台算出的openid、unionid等保存/更新到数据库的会员表中,并返回算出的session_key+会员信息。

③判断会员信息中手机号是否为空。如果手机号为空,获取手机号授权;否则返回登录界面。

④获取手机号授权,允许后在后台解密。得到手机号。更新数据库中会员表的手机号。

----------------------------------------------------------------------------------------------------------------------------

 

3.相关参数/组件/api

 

①开放接口-登录(wx.login)

功能:调用接口获取登录凭证(code)

微信官方文档:https://developers.weixin.qq.com/miniprogram/dev/api/open-api/login/wx.login.html

object.success 回调函数:code--用户登录凭证,有效期5分钟,每次登录都会更新,需要在服务器后台调用 auth.code2Session,使用 code 换取 openid 和 session_key 等信息。

注意:auth.code2Session的使用在本文档后边。

 

②微信授权-授权弹窗(wx.getSetting)

功能:获取用户当前的授权状态。

微信官方文档:https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/authorize.html

scope 列表:用户信息(wx.getUserInfo)、地理位置(wx.getLocation, wx.chooseLocation)等,更多可在微信官方文档中查看。此处用到用户信息。

 

③开放接口-用户信息(wx.getUserInfo)

功能:获取用户信息

微信官方文档:https://developers.weixin.qq.com/miniprogram/dev/api/open-api/user-info/wx.getUserInfo.html

参数:withCredentials(是否带上登录态信息)、lang(显示用户信息语言,简体中文:zh_CN)等。

object.success 回调函数:userInfo--对象,用户信息(微信用户昵称、图片url、性别等);encryptedData--完整用户信息的加密数据;iv--加密算法的初始向量;

注意:userinfo对象的详细信息参照微信官方文档(https://developers.weixin.qq.com/miniprogram/dev/api/open-api/user-info/UserInfo.html)。

 

④指南-获取手机号(getPhoneNumber)

功能:获取微信用户绑定的手机号。需要先调用wx.login,需要用户主动触发才能发起接口,需要通过button触发。

使用方法:

返回参数:encryptedData--完整用户信息的加密数据;iv--加密算法的初始向量;

加密后得到参数:phoneNumber--用户绑定的手机号。 json 结构。

微信官方文档:https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/getPhoneNumber.html

 

你可能感兴趣的:(Java,HTML,JavaScript,vue,java,小程序)