微信小程序获取手机号 个人信息
在这里插入代码片<template>
<view>
<!-- #ifdef MP-WEIXIN -->
<view>
<view>
<view class='header'>
<image src="../../static/index/wx.png" mode=""></image>
</view>
<view class='content'>
<view>申请获取以下权限</view>
<text>获得你的公开信息(昵称,头像、地区、手机号码等)</text>
</view>
<button class='bottom' type='primary' open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">授权登录</button>
</view>
</view>
<!-- #endif -->
</view>
</template>
<script>
// 后端接口
import { HTTP_REQUEST_URL } from "../../config/index.js"
export default {
data() {
return {
SessionKey: '',
OpenId: '',
code:"",
isCanUse: uni.getStorageSync('isCanUse')||true//默认为true
};
},
methods: {
// 手机号
getPhoneNumber(e){
if (e.detail.errMsg == "getPhoneNumber:ok") {
this.SessionKey = e.detail
this.wxLogin()
}
},
//登录
wxLogin() {
let that = this
wx.login({
success(res) {
if (res.code) {
// const code = res.code;
that.code = res.code
uni.request({//获取openID
url: HTTP_REQUEST_URL, //仅为示例,并非真实接口地址。
data: {code: that.code},
success: (res) => {//返回状态来判断是否授权过了
uni.showModal({
title: '提示',
content: '检查到您是首次使用小程序,我们希望获得您的个人信息,以便为您提供更好的服务!',
showCancel: false,
success: function(res) {
if (res.confirm) {
wx.getUserProfile({
desc: '用于完善用户资料',
success: (res) => {
if(res.errMsg === 'getUserProfile:ok'){
uni.setStorageSync('isCanUse', false);
that.updateUserInfo(res.userInfo);
}
}
});
}
}
});
}
});
}
}
});
},
//向后台更新信息
updateUserInfo(data) {
let _this = this;
// 注册登录
_this.$requestApi.publicApi.userReg({
code: _this.code,
nickName:data.nickName,
avatarUrl: data.avatarUrl,
sex:data.sex
}).then(res => {
const index = res.lastIndexOf('|')
const token = "Bearer" + ' ' + res.substring(index + 1, res.length)
this.$store.commit("LOGIN",{'token':token})
// 获取手机号码
_this.$requestApi.publicApi.getPhone({
encryptedData: _this.SessionKey.encryptedData,
iv: _this.SessionKey.iv
}).then(res =>{
this.$requestApi.publicApi.userInfo().then(res => {
uni.setStorageSync('user_info',res.data)
uni.reLaunch({//信息更新成功后跳转到小程序首页
url: '/pages/home/index'
});
})
})
.catch(err => {
uni.showToast({
title:"登录失败,请重新登录",
icon:"none",
type:"error"
})
})
})
.catch(err => {
uni.hideLoading();
uni.showToast({
title:"登录失败,请重新登录",
icon:"none",
type:"error"
})
})
}
},
}
</script>
<style>
.header {
margin: 90rpx 0 90rpx 50rpx;
border-bottom: 1px solid #ccc;
text-align: center;
width: 650rpx;
height: 300rpx;
line-height: 450rpx;
}
.header image {
width: 200rpx;
height: 200rpx;
}
.content {
margin-left: 50rpx;
margin-bottom: 90rpx;
}
.content text {
display: block;
color: #9d9d9d;
margin-top: 40rpx;
}
.bottom {
border-radius: 80rpx;
margin: 70rpx 50rpx;
font-size: 35rpx;
background-color: #03c963 !important;
}
</style>