微信小程序获取用户信息和手机号登录

以下是代码实现 以下代码是用户信息和手机号登录的，请求接口需要4个参数的案例

<view>
		<button style="width:200rpx;margin:10px auto" type="primary" @click="getUserInfo">微信登录</button>
		<view class="login_Pop_ups" v-if="isShow">
			<view class="login_mask" @click="close_btn"></view>
			<view class="login_main">
				<view>绑定手机号</view>
				<view>请先绑定手机号再进行此操作</view>
				<button type="primary" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">微信一键登录</button>
			</view>
			
		</view>
	</view>
data(){
     return {
          isShow:false
     }
},
methods: {
			close_btn(){
				this.isShow=false;
			},
			getUserInfo(){
				let that = this;
				uni.getUserProfile({
					desc:"获取用户基本资料",
					success(res) {
						console.log(res,123)
						
						let userInfo = res.userInfo;
						that.userInfo = userInfo;
						uni.login({
							success(res) {
								that.login_code = res.code;
								
								that.isShow=true;
								uni.hideLoading()
							},
							fail(err) {
								console.log(err)
							}
						})	
					},
					fail(err) {
						uni.showToast({
							'title':"拒绝授权，无法访问"
						})
					},
					
				})
			},
			getPhoneNumber(e){
				uni.showLoading({
					title:'加载中...'
				})
				let that = this;
				
				if(e.detail.errMsg == "getPhoneNumber:ok"){
					uni.request({
						url:`请求后台接口地址`,
						method:'POST',
						data:{
							rawData:JSON.stringify(that.userInfo),//非敏感信息
							code:that.login_code,//临时登录凭证
							encrypteData:e.detail.encryptedData,//用户敏感信息
							iv:e.detail.iv//解密算法向量
						},
						success(res) {	
							
							uni.hideLoading()
							if(res.data.code == 500){
								uni.showModal({
								    title: '提示',
								    content: '很抱歉，您没有登录权限',
								    showCancel:false,
									success: function (res) {
								        if (res.confirm) {
								            console.log('用户点击确定');
								        } else if (res.cancel) {
								            console.log('用户点击取消');
								        }
								    }
								});
								return;
							}
							if(res.data.success){
								//把以下返回值存储一下
								uni.setStorageSync('storage_userInfo',res.data.result);
								uni.setStorageSync('storage_userToken',res.data.result.token);
								//主要是openid存储一下，在App.vue的onShow方法中获取判断，有的话直接进入，没有到登录
								uni.setStorageSync('storage_openid',res.data.result.openid);
								setTimeout(()=>{
									uni.switchTab({
										url:'/pages/index/index'
									})	
								},1000)
								that.show = false;
							}else{
								uni.showToast({
									title:res.data.message,
									duration:1500,
									icon:'error'
								})
							}
						},
						fail(error) {
							uni.showModal({
								title:error,
								showCancel:false
							})
						}
					})
				}else{
					
				}
			}
		}

以上是需要两个请求参数的接口，如下

<button type="primary" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">微信一键登录</button>
getPhoneNumber(e){
				uni.showLoading({
					title:'加载中...'
				})
				let that = this;
				
				if(e.detail.errMsg == "getPhoneNumber:ok"){
					uni.request({
						url:`请求后台接口地址`,
						method:'POST',
						data:{
                                                        encrypteData:e.detail.encryptedData,//用户敏感信息
							iv:e.detail.iv//解密算法向量
						},
						success(res) {	
							
							uni.hideLoading()
							if(res.data.code == 500){
								uni.showModal({
								    title: '提示',
								    content: '很抱歉，您没有登录权限',
								    showCancel:false,
									success: function (res) {
								        if (res.confirm) {
								            console.log('用户点击确定');
								        } else if (res.cancel) {
								            console.log('用户点击取消');
								        }
								    }
								});
								return;
							}
							if(res.data.success){
								//把以下返回值存储一下
								uni.setStorageSync('storage_userInfo',res.data.result);
								uni.setStorageSync('storage_userToken',res.data.result.token);
								//主要是openid存储一下，在App.vue的onShow方法中获取判断，有的话直接进入，没有到登录
								uni.setStorageSync('storage_openid',res.data.result.openid);
								setTimeout(()=>{
									uni.switchTab({
										url:'/pages/index/index'
									})	
								},1000)
								that.show = false;
							}else{
								uni.showToast({
									title:res.data.message,
									duration:1500,
									icon:'error'
								})
							}
						},
						fail(error) {
							uni.showModal({
								title:error,
								showCancel:false
							})
						}
					})
				}else{
					
				}
			}

APP.vue文件中

onLaunch: function() {
		
			let storage_openid = uni.getStorageSync('storage_openid')
			console.log('storage_openid',storage_openid)
			if(storage_openid){
				uni.checkSession({
			　　　　success: function(){
			　　　　　　uni.switchTab({
							url:"/pages/index/index"
						})
			　　　　},
			　　　　fail: function(res){
			　　　　　　
			　　　　　　uni.navigateTo({
							url:"/pages/Login/Login"
						})　
			　　　　}
			　　})
			}
			
		},
		onShow: function() {
			console.log('App Show1')
			let storage_openid = uni.getStorageSync('storage_openid')
			console.log('storage_openid1',storage_openid)
			if(storage_openid){
				uni.checkSession({
			　　　　success: function(){
			　　　　　　uni.switchTab({
							url:"/pages/index/index"
						})
			　　　　},
			　　　　fail: function(res){
			　　　　　　
			　　　　　　uni.navigateTo({
							url:"/pages/Login/Login"
						})　
			　　　　}
			　　})
			}
		},

以上这是两种参数的请求方式，到时候就看咱们后台接口需要几个参数了，到此微信小程序获取用户信息手机号授权登录就完事了，希望对小伙伴们有帮助。