uniapp 小程序 获取手机号---通过前段获取

该代码示例展示了在微信小程序中进行用户登录、获取微信授权信息、解密手机号的过程。首先通过uni.login获取登录code,然后用code换取openid和session_key。接着获取手机号的加密数据,并使用WXBizDataCrypt.js进行解密,得到用户的手机号。
摘要由CSDN通过智能技术生成
<template>
	<!-- 获取手机号,登录内容 -->
	<view>
		<!-- 首先需要先登录获取code码,然后才可以获取用户唯一标识openid以及会话密钥及用于解密获取手机的加密信息 -->
		<view @click="login">登录</view>
		<view class="" @click="get_miyao" style="padding: 40rpx;">获取密钥session_key</view>
		<!-- 获取手机号的加密 -->
		<button open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">获取电话</button>
		<!-- <view @click="check_user">检查是否登录</view> -->
		<view class="" @click="get_user">获取用户信息</view>
		
		
		<view @click="jiemi">解密</view>
		
		<view class="" style="height: 60rpx;"> ========== </view>
		<br>
		
		<image :src="user_img" mode="" alt="暂无图片"></image>
		<view class="red">用户名:{{user_name}}</view>
		<text class="blue">微信登录成功:{{login_code}}</text>
		<view class="red">手机号:{{phone}}</view>
		<view class="blue">用户唯一标识openid:{{openid}}</view>
		<view class="red">会话密钥-sessionkey:{{session_key}}</view>
		<view class="blue">手机-encryptedData:{{phone_encryptedData}}</view>
		<view class="red">手机-iv:{{phone_iv}}</view>
		<view class="blue">手机-code:{{phone_code}}</view>
	</view>
</template>

<script>
	//import WXBizDataCrypt from "@/static/wx/WXBizDataCrypt.js"
	import WXBizDataCrypt from "../../utils/WXBizDataCrypt"

	export default {
		data() {
			return {
				phone:'无',
				user_img:'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSNuo1br3pHCs7Y-RLdS0oc-dflmDaUdm_Jkg&usqp=CAU',
				user_name:'空',
				login_code:'空', // 登录返回code码,用于获取用户唯一标识和会话密钥
				openid:'',// 用户唯一标识
				session_key:'',// 会话密钥
				phone_encryptedData:'',
				phone_iv:'',
				phone_code:''
				
			}
		},
		methods: {
			login(){ // 微信登录
				uni.login({
				    provider: 'weixin',
				    success: res => {
				    	debugger
						console.log(res)
						this.login_code = res.code
					}
				    
				});
			},
			check_user(){ // 检查是否登录
				uni.checkSession({
					success:res => {
						console.log(res)
					}
				})
			},
			get_user(){ // 获取用户信息
				uni.getUserProfile({
					desc: '用户登录',
					success: res => {
						console.log(res)
						this.user_img = res.userInfo.avatarUrl
						this.user_name = res.userInfo.nickName
					}
				})
			},
			getPhoneNumber(res){ // 获取手机号
				console.log(res)
				this.phone_code = res.detail.code
				this.phone_encryptedData = res.detail.encryptedData
				this.phone_iv = res.detail.iv
				
			},
			get_miyao(){ // 获取密钥 === 需要登录才可以获取密钥
				uni.request({
				    url: 'https://api.weixin.qq.com/sns/jscode2session',
				    method:'GET',
				    data: {
						appid: 'wx4e70a3d6c0f866f3',        //你的小程序的APPID
						secret: '9ee0d4c6e1a996fbd90725f4a7176e5f',    //你的小程序秘钥secret,
						js_code: this.login_code,    //wx.login 登录成功后的code
						grant_type:'authorization_code'
				    },
				    success: (res) => {
				        console.log('获取信息',res);  // 换取成功后 暂存这些数据 留作后续操作
				        this.openid=res.data.openid    //openid 用户唯一标识
				        this.session_key=res.data.session_key    //session_key  会话密钥
				    }
				});
			},
			jiemi(){ // 解密需要appid 会话密钥;然后需要手机号的加密字段-
				let pc = new WXBizDataCrypt('wx4e70a3d6c0f866f3',this.session_key);
				let data = pc.decryptData(this.phone_encryptedData , this.phone_iv);  
				console.log(data)       //data就是最终解密的用户信息
				debugger
				this.phone = data.phoneNumber
			}
			
		}
	}
</script>

<style scoped>
image{
	width: 100rpx;
	height: 100rpx;
}
.red{
	background-color: #DD524D;
	margin: 20rpx 0;
}
.blue{
	background-color: #007AFF
}
</style>

js 解密文件

import WXBizDataCrypt from "../../utils/WXBizDataCrypt"
//WXBizDataCrypt.js
var crypto = require('crypto')

function WXBizDataCrypt(appId, sessionKey) {
    this.appId = appId
    this.sessionKey = sessionKey
}

WXBizDataCrypt.prototype.decryptData = function (encryptedData, iv) {
    // base64 decode
    var sessionKey = new Buffer(this.sessionKey, 'base64')
    encryptedData = new Buffer(encryptedData, 'base64')
    iv = new Buffer(iv, 'base64')

    try {
        // 解密
        var decipher = crypto.createDecipheriv('aes-128-cbc', sessionKey, iv)
        // 设置自动 padding 为 true,删除填充补位
        decipher.setAutoPadding(true)
        var decoded = decipher.update(encryptedData, 'binary', 'utf8')
        decoded += decipher.final('utf8')

        decoded = JSON.parse(decoded)

    } catch (err) {
        throw new Error('Illegal Buffer')
    }

    if (decoded.watermark.appid !== this.appId) {
        throw new Error('Illegal Buffer')
    }

    return decoded
}

module.exports = WXBizDataCrypt

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值