微信小程序如何获取用户手机号码？-Toy模板网

这篇具有很好参考价值的文章主要介绍了微信小程序如何获取用户手机号码？。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

需求

在开发一款微信小程序时，通常需要用户进行微信登录，并获取用户的手机号码作为用户的唯一标识（userId）。虽然可以通过wx.login来获取用户的openid，但有时候需要获取用户的手机号码以提供更完善的个性化服务，因此探索获取用户手机号码的方式成为开发中的一个重要需求。

目前版本的微信小程序获取用户手机号码的方式如下：

前端开发参考：手机号快速填写组件 | 微信开放文档

后端开发参考：手机号快速填写 | 微信开放文档

获取用户手机号码的步骤

在小程序开发中，利用手机号快速填写的功能，将button组件的open-type的值设置为getPhoneNumber，并编写相应的事件监听函数。
当用户点击按钮时，将弹出申请获取用户手机号的授权弹窗。
如果用户同意授权，前端将获得一个动态令牌code，这个code与wx.login返回的code不同，且获取用户手机号码并不需要预先调用wx.login获取code。
将获得的code传输到后端，后端调用微信提供的phonenumber.getPhoneNumber接口，使用code换取用户的手机号。

怎么找微信测试号来测试获取手机号,微信小程序,小程序,uni-app

需要注意的是，获取手机号的功能只允许经过认证的小程序使用，未认证的小程序只能使用测试号进行开发和测试

前端代码示例

我们使用 uniapp框架进行前端开发，以下是一个简单的示例代码：

按钮：

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

getPhoneNumber函数：

getPhoneNumber(e) {
  this.code = e.detail.code;
  LoginAPI({
	code: this.code,
  }).then(async (res) => {
	console.log('res', res)
  });
}

后端代码示例

我们使用Node.js进行后端开发，以下是一个简单的示例代码：文章来源地址https://www.toymoban.com/news/detail-855066.html

public async Login(body){
	//检查token有没有过期
	let access_token = await this.cacheService.get("access_token")
	if(!token){
		// 获取token
		 const tokendata = await this.httpService.get(`https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=${APP_CONFIG.WECHAT.APPID}&secret=${APP_CONFIG.WECHAT.SECRET}`)
		 access_token = tokendata.data.access_token
	}

	// 获取手机号
	const phonedata = await this.httpService.post(`https://api.weixin.qq.com/wxa/business/getuserphonenumber?access_token=${access_token}`, {
		code: body.code
	})
	const phoneNumber = phonedata.data.phone_info.phoneNumber
	return phoneNumber
}

到了这里，关于微信小程序如何获取用户手机号码？的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！