最近微信小程序进行了调整
2021年4月13日后发布的新版本小程序,开发者通过组件调用wx.getUserInfo将不再弹出弹窗,直接返回匿名的用户个人信息,获取加密后的openID、unionID数据的能力不做调整;若开发者需要获取用户的个人信息(头像、昵称、性别与地区),可以通过wx.getUserProfile接口进行获取。微信公告
我这里的处理方法是使用之前的 getUserInfo (获取openID) 加 新的 wx.getUserProfile (获取头像、昵称、性别等信息)结合传给后台进行存储。
HTML
<view wx:if="{{pagestate == 1}}" class="but-box">
<!-- 未授权 -->
<button bindtap="getUserInfo" bindgetuserinfo="onGotUserInfo" data-type="1" open-type='getUserInfo' lang="zh_CN" class="button button-dark">获取微信授权</button>
<button bindtap="getUserInfo" bindgetuserinfo="onGotUserInfo" data-type="2" open-type='getUserInfo' lang="zh_CN" class="button button-blue">手机号验证码登录</button>
</view>
<view wx:else class="but-box">
<!-- 已授权 -->
<button bindgetphonenumber="login" open-type='getPhoneNumber' lang="zh_CN" class="button button-dark ">微信一键登录</button>
<button bindtap="toLogin" class="button button-blue">手机号验证码登录</button>
</view>
JS
let userInfo = null;
Page({
data: {
pagestate: 1, // 获取用户信息授权状态,1未授权,2已授权
},
// 授权 获取用户头像昵称等信息
onGotUserInfo(e){
let that = this;
if (typeof e.detail.userInfo !== 'undefined' && e.detail.userInfo) {
// 记录微信授权返回的用户数据
this.getUserInfo1(()=>{})
} else {
userinfo = null;
this.setData({
pagestate: 1
});
// 授权失败
app.showToast('未同意授权!', () => {
wx.switchTab({
url: '/pages/home/index'
})
})
}
},
getUserInfo(e){
let type = e.currentTarget.dataset.type;
let that = this;
wx.getUserProfile({
desc: '用于完善会员资料',
success (res) {
// console.log(96,res)
// console.log(that)
// 记录微信授权返回的用户数据
that.getUserInfoSuccess(res.userInfo);
// userInfo = Object.assign({}, res.userInfo);
// app.globalData.userInfo = userInfo;
if(type == 2){
that.toLogin()
}
},
fail (res) {
userInfo = null;
that.setData({
pagestate: 1
});
},complete(res){
console.log(res,103)
}
})
},
// 获取用户信息成功处理
getUserInfoSuccess(userInfoData) {
console.log(userInfoData)
userinfo = Object.assign({}, userInfoData);
app.globalData.userInfo = userinfo;
wx.setStorageSync('userInfo', userinfo);
// wx-登录
wx.login({
success: (res) => {
if (res.code) {
this.setData({
pagestate: 2,
code: res.code
})
} else {
wx.showToast({
title: '服务器异常',
icon: 'none',
duration: 1500
})
}
},
complete: (res) => { },
})
},
// 登录
wxLogin(callback){
wx.login({
success: (res) => {
if (res.code) {
this.setData({
code: res.code
})
} else {
wx.showToast({
title: '服务器异常',
icon: 'none',
duration: 1500
})
}
},
complete: (res) => {
typeof callback === 'function' && callback(res)
},
})
},
// 登录
login(e){
let that = this;
let dat = e.detail;
// wx-登录
// this.getUserInfo1();
if ("getPhoneNumber:ok" != e.detail.errMsg) {
wx.showModal({
title: '提示',
showCancel: false,
content: '获取用户手机号未授权',
success: function (res) {
console.log('未授权');
}
})
} else {
this.getUserInfo1(()=>{
that.wxLogin((res)=>{
// console.log(res.code)
wx.showLoading({
mask: true,
title: '加载中...',
})
clearTimeout(time)
time = setTimeout(()=>{
// 注册/登录
app.request('api_shop/login/oneClickRegister', {
code: res.code, // 微信登录 code
u_iv: that.data.u_iv, // u_iv 用户 微信加密码
u_encrypted_data: that.data.u_encrypted_data, // u_encrypted_data 用户 微信加密码
iv: dat.iv, // 微信加密码
encrypted_data: dat.encryptedData, // 微信加密码
head_img: userinfo.avatarUrl, // 头像
nick_name: userinfo.nickName, // 微信名称
inviteId: that.data.inviteId, // 邀请码
}, (res) => {
wx.hideLoading()
if (res.rc == 200) {
// 成功
wx.showToast({
title: res.des || '登录成功!',
mask: true,
duration: 2000
})
// 记录token及用户信息
app.globalData.token = res.data.token;
app.globalData.user_data = res.data.user_data;
app.globalData.cabinet_id = null; // 选择的网点 id
app.globalData.cabinet_info = null; // 选择的网点 信息
wx.setStorageSync('userData', res.data.user_data);
wx.setStorageSync('token', res.data.token);
} else {
// 失败
app.globalData.token = '';
wx.showToast({
title: res.des + '',
icon: 'none',
duration: 3600
})
}
}, (res) => {
// 失败
wx.hideLoading()
app.globalData.token = '';
wx.showToast({
title: res.des,
icon: 'none',
duration: 1500
})
}, (res) => {
// 请求结束
})
},800)
})
})
}
},
toLogin(){
console.log('手机号验证码登陆')
},
})
END