uniapp中微信小程序获取用户信息与手机号

最新推荐文章于 2025-09-11 12:03:53 发布

原创最新推荐文章于 2025-09-11 12:03:53 发布 · 5k 阅读

16 ·

CC 4.0 BY-SA版权

文章标签：

#微信小程序 #小程序 #前端

uniapp 专栏收录该内容

4 篇文章

订阅专栏

这段代码展示了如何在微信小程序中实现用户信息和手机号的获取。通过`<button open-type=getUserInfo>`和`<button open-type=getPhoneNumber>`监听事件，调用`wxGetUserInfo`和`wxGetPhone`方法。用户授权后，使用`uni.getUserProfile`获取用户信息，`decryptPhone`方法用于解密获取的手机号，并与后台交互。若用户拒绝授权，会显示错误提示。

<!-- #ifdef MP-WEIXIN -->
		<view>
			<button open-type="getUserInfo" @getuserinfo="wxGetUserInfo">登录</button>
		</view>

		<view>
			<button open-type="getPhoneNumber" @getphonenumber="wxGetPhone">获取手机号</button>
		</view>
		<!-- #endif -->

	//获取手机号
			wxGetPhone(e) {
				console.log("phone", e);
				if (!e.detail.code) {
					uni.showToast({
						title: '获取手机号失败',
						icon: 'none'
					})
					return;
				}
				that.decryptPhone(e.detail.code);

			},
			//解密手机
			decryptPhone(obj) {
				var that = this;
				//传给后台解密，获得手机号
				this.$api.getPhone({code:obj})
					.then(ss => {
						if (ss.code == 200) {
							console.log(ss)
						} else {
							uni.showToast({
								title: '获取手机号失败，请重试',
								icon: 'none'
							})
						}
					})
					.catch(ss => {
						uni.showToast({
							title: '获取手机号失败，请重试',
							icon: 'none'
						})
					})
			},
			// 获取用户信息
			wxGetUserInfo(e) {
				uni.showModal({
					title: '温馨提示',
					content: '亲，授权微信登录后才能正常使用小程序功能',
					success(res) {
						console.log(0)
						console.log(res)
						//如果用户点击了确定按钮
						if (res.confirm) {
							uni.getUserProfile({
								desc: '获取你的昵称、头像、地区及性别',
								success: res => {
									console.log(res);
									console.log(1);
								},
								fail: res => {
									console.log(2);
									console.log(res)
									//拒绝授权
									uni.showToast({
										title: '您拒绝了请求,不能正常使用小程序',
										icon: 'error',
										duration: 2000
									});
									return;
								}
							});
						} else if (res.cancel) {
							//如果用户点击了取消按钮
							console.log(3);
							uni.showToast({
								title: '您拒绝了请求,不能正常使用小程序',
								icon: 'error',
								duration: 2000
							});
							return;
						}
					}
				});
			},