微信小程序获取手机号

1、先新建vue页面

打开看到页面是下图

在method定义方法

源码:

javascript 复制代码
<template>
	<view>
		<button type="primary" open-type="getPhoneNumber" @getphonenumber="getPhoneNumberFn">登录</button>
		<view class="">
			{{phone}}
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				phone: ""
			}
		},
		methods: {
			getPhoneNumberFn(e) {
				// console.log(e.detail);
				// console.log(e.detail.encryptedData); // 加密之后得用户隐私信息
				let encryptedData = e.detail.encryptedData // 加密之后得用户隐私信息
				let iv = e.detail.iv // 加密的向量
				uni.login({
					success: (res) => {
						console.log(666);
						console.log(res.code); // 获取用户登录的临时凭证(5分钟有效期)
						let code = res.code
						// 获取code之后调用uni.request()这个api将code传递给后端工程师
						uni.request({
							url: 'http://192.168.1.24:3000/getsessionkey',
							method: "get",
							data: {
								code: code
							},
							success: (result) => {
								console.log(result);
								let openid = result.data.data.openid
								let session_key = result.data.data.session_key
								// 前端将加密的数据encryptedData结合openid和session_key和iv给后端(调用后端给的接口)后端根据(官方给的解密方法)进行数据解密,将解密之后得数据给前端(前端做显示)
								uni.request({
									url: 'http://192.168.1.24:3000/getphonenumber',
									method: "get",
									data: {
										openid,
										session_key,
										iv,
										encryptedData
									},
									success: (result2) => {
										console.log(result2);
										this.phone = result2.data.data.phoneNumber
									}
								})
							}
						})
					},
				})
			},
		}
	}
</script>

<style>

</style>

node.js文件下载解压后启动node app.js打开服务器即可

点击下载

相关推荐
2501_9160088911 小时前
深入解析iOS应用启动性能优化策略与实践
android·ios·性能优化·小程序·uni-app·cocoa·iphone
TuCoder17 小时前
制作景区导览小程序时,现有手绘图是否可以复用?
小程序·智慧景区·手绘地图·景区导览·电子导览·地图制作·ebmap
小小王app小程序开发1 天前
盲盒小程序一番赏玩法分析
小程序
这是个栗子1 天前
【微信小程序问题解决】删掉 “navigationStyle“: “custom“ 后仍触发了自定义导航栏
微信小程序·小程序·navigationstyle
liangdabiao1 天前
定制的乐高马赛克像素画生成器-微信小程序版本-AI 风格优化-一键完成所有工作
人工智能·微信小程序·小程序
编程小白gogogo1 天前
苍穹外卖微信小程序导入hbuilder后点击运行选择在微信开发者工具中打开,微信开发者工具打开却没有运行微信小程序解决办法
微信小程序·小程序
梦梦代码精1 天前
LikeShop 深度测评:开源电商的务实之选
java·前端·数据库·后端·云原生·小程序·php
天籁晴空1 天前
微信小程序 静默登录 + 授权登录 双模式配合的设计方案
前端·微信小程序·uni-app
2501_915921432 天前
穿越HTTPS迷雾:Wireshark中的TLS抓包秘诀与文件合并方法
网络协议·ios·小程序·https·uni-app·wireshark·iphone
PinTrust SSL证书2 天前
Sectigo(Comodo)企业型OV通配符SSL
网络·网络协议·网络安全·小程序·https·ssl