uniapp使用手机号登录

259 阅读1分钟

因为目前该接口只针对非个人开发者,所以需要准备一个已经认证了的小程序

image.png

使用小程序官网提供的button方法,实现弹窗获取手机号

<button class="button" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">手机号登录</button>

先获取code发送到后端换取sessionKey,用户同意后需发送iv,encrypetdData,openid到后端解析

data() {
			return {
				code: '',
				sessionKey: '',
				openid: '',
				encryptedData: '',
				iv: '',
			}
		},
onLoad() {
			var that = this
			//获取 loginRes.code
			uni.login({
				provider: 'weixin',
				success: function(loginRes) {
					that.code = loginRes.code
					that.toLogin();
				}
			});
		},

                   getPhoneNumber(e) {
				console.log("errMsg", e.detail.errMsg)
				let that = this
				if (e.detail.errMsg == 'getPhoneNumber:fail user deny') {
					console.log('用户拒绝提供手机号');
				} else {
					console.log('用户同意提供手机号');
					console.log("iv", e.detail.iv)
					console.log("encryptedData", e.detail.encryptedData)
					let encryptedData = e.detail.encryptedData
					let iv = e.detail.iv
					//检查登录
					uni.checkSession({
						success: (res) => {
							console.log("checkSession--success---res", res)
							if (res.errMsg == 'checkSession:ok') {
								console.log(res);
								console.log('登录暂未过期');
								if (encryptedData !== undefined && iv !== undefined) {
									that.getPhone(encryptedData, iv)
								}
							}
						},
						fail: (res) => {
							console.log("checkSession---fail---res", res)
							console.log('登录已过期');
							//再执行一次login
							uni.login({
								provider: 'weixin',
								success: function(loginRes) {
									console.log("loginRes.code", loginRes.code);
									that.loginResCode = loginRes.code

									if (encryptedData !== undefined && iv !== undefined) {
										that.getPhone(encryptedData, iv)

									}
								}
							});
						}
					})
				}
				//e.detail.errMsg == 'getPhoneNumber:fail Error: 用户未绑定手机,请先在微信客户端进行绑定后重试'  微信会自动引导用户去绑定手机
			},
			//手机号发送至后台解密
			getPhone(encryptData, ivStr) {
				console.log('encryptData', encryptData)
				console.log('ivStr', ivStr)
				this.$axios({
					url: "/wtcrm/auth/binding",
					method: "post",
					header: {
						'content-type': "application/json;",
					},
					data: {
						iv: ivStr,
						encrypetdData: encryptData,
						openid: this.openid,
						sessionKey: this.sessionKey
					},
				}).then(res => {
					if (res.code == 200) {
						uni.showToast({
							title: '登录成功',
							icon: 'success',
							duration: 1000,
							success: function() {
								uni.redirectTo({
									url: "../index/index"
								})
							}
						});
					}
				})
			},

			toLogin() {
				this.$axios({
					url: "/wtcrm/auth/login",
					method: "get",
					data: {
						code: this.code
					}
				}).then(res => {
					console.log('11111')
					console.log('res', res)
					if (res.wxInfo) {
						this.openid = res.wxInfo.openid
						this.sessionKey = res.wxInfo.sessionKey
					}
					uni.setStorageSync('token', res.token)
					uni.setStorageSync("userInfo", res.user)
					let token = uni.getStorageSync('token')
					console.log('%c res 请求数据', 'color: green', res);
					if (res.code == 203) {
						uni.showToast({
							title: '登录成功',
							icon: 'success',
							duration: 1000,
							success: function() {
								uni.redirectTo({
									url: "../index/index"
								})
							}
						});
					}
				})

			},