uniapp+vue实现微信小程序授权手机号

192 阅读1分钟

小颖最近在开发小程序,遇到了要先从微信授权获取 手机号获取凭证,然后再调后端封装的接口返回授权的手机号。
废话不多说咱直接上代码

html:

<button class="btn-user default-btn" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber" plain="true">获取手机号授权登录</button>

js:

getPhoneNumber(e) {
				this.getPhoneNum(e.detail.code); // 动态令牌
				console.log(e.detail.errMsg); // 回调信息(成功失败都会返回)
				console.log(e.detail.errno); // 错误码(失败时返回)
			},

然后调用后端的接口 获取手机号

			async getPhoneNum(code) {
				const params = {
					url: '/rest/public/get-phone-number',
					method: 'POST',
					data: {
						Code: code
					}
				};
				const result = await this.serverApi.request(params);
				const [success, data] = result;
				console.log(data);
				uni.setStorageSync('get_phone_number', data.phoneNumber);
			},