支付宝小程序-授权,获取手机号,登录等技术
注意
- 小程序 不允许首屏弹窗引导用户授权。需要在用户充分了解小程序的业务内容后再引导用户授权,建议将小程序授权环节放在业务流程中
- 官网:https://opendocs.alipay.com/mini/introduce/authcode
获取授权码-getAuthCode
<button type="primary" onTap="getAuthCode">获取授权码</button> Page({ data: {}, onLoad() {}, getAuthCode: () => { my.getAuthCode({ scopes: auth_user, success: ({ authCode }) => { console.log(authCode: , authCode); }, }); }, }); //结果 authCode: 34d2caa2e4d542fd89562863090fVD34
后台 后台拿到authcode后去获取token
获取用户信息-getOpenUserInfo
注意:必须使用button+(open-type=“getAuthorize”)才能使用
<button type="primary" open-type="getAuthorize" onGetAuthorize="getUserInfo" onError="onAuthError" scope=userInfo>会员基础信息授权</button>
接着调用my.getOpenUserInfo
getUserInfo(){ my.getOpenUserInfo({ fail: (err) => { // console.log(获取用户信息失败: , err); }, success: (res) => { let userInfo = JSON.parse(res.response).response // 以下方的报文格式解析两层 response // console.log(获取用户信息-suc: , userInfo); } }); }
返回如下字段
avatar: "https://tfs.alipayobjects.com/images/partner/T1jU8rXopdXXXXXXXX" city: "杭州市" code: "10000" countryCode: "CN" gender: "m" msg: "Success" nickName: "zyf" province: "浙江省"
获取手机号
https://opendocs.alipay.com/mini/introduce/01sxqf#user_name 注意:必须使用button组件配open-type,scope
<button type="primary" open-type="getAuthorize" onGetAuthorize="getPhoneSuc" onError="getPhoneErr" scope=phoneNumber>授权手机号</button>
getPhoneSuc(){ my.getPhoneNumber({ success: (res) => { console.log(res: , res); let encryptedData = JSON.parse(res.response); console.log(getPhone-suc: , encryptedData); resolve(encryptedData); // my.request({ // url: 你的后端服务端, // data: encryptedData, // }); }, fail: (res) => { console.log(getPhone-err: , res); reject(res) }, }); }
获取信息对比
1.获取用户信息 open-type="getAuthorize" scope=userInfo 2.获取手机号 open-type="getAuthorize" scope=phoneNumber
项目中登录流程
获取授权码 --> 获取手机号 --> 将授权码、手机号密文传给后台 --> 后台去获取用户信息、token并返回 最后,如果帮你脱坑的话,希望小伙伴们打赏一毛钱
上一篇:
uniapp开发微信小程序-2.页面制作
下一篇:
PC端微信扫码关注公众号并登录