前言:微信小程序的app.js里面,最少有2个接口,一个wx.login;一个是wx.getUserInfo; 前者得到腾讯给我们的微信用户唯一的code,通过code获取openid,这个不需要用户授权,我们肯定能得到;
但是,后者是需要用户授权,我们才能通过腾讯得到用户的其他信息,比如nickname、avatarUrl、encryptedData、iv等,如果你只需要openid,下面的代码你可以不用看了,下面重点讲解如何
多次调用wx.getUserInfo或者app.getUserInfo接口获取用户的nickname、avatarUrl等信息。
1、我们知道,微信用户首次进入小程序,会进行授权请求,有的用户可能会选择拒绝授权,那么我们调用的wx.getUserInfo接口返回fail;
可能展示型功能并不影响(如信息展示页),交互型功能肯定是影响的(如下单、支付、注册等)
2、如何再次调用wx.getUserInfo或者app.getUserInfo接口去获取用户的nickName、avatarUrl、等其他重要信息呢(这里不包括openid的,你可以在wx.login通过code获取openid,这里不讲获取获得code,自行百度)
3、比如说,我们可以在小程序>个人中心页面,用户点击【我】的时候,在onload或者onReady时候,调用下面这个方法,执行:再次确认是否授权->用户授权->获取userInfo(包含:nickname、avatarUrl等)->自定义操作(比如注册、或者 将获得的用户nickname和avatarUrl 现实在页面上)->其他操作
4、方法代码:其中【私人订制】这里是自己进行php后台注册的一个过程,你们根据自己需求进行开发
var loginStatus = true;//默认授权成功 var getPromission = function (that) { if (!loginStatus) { wx.openSetting({ success: function (data) { if (data) { if (data.authSetting["scope.userInfo"] == true) { loginStatus = true; wx.getUserInfo({ withCredentials: false, success: function (data) { console.info ("2成功获取用户返回数据"); console.info (data.userInfo); }, fail: function () { console.info ("2授权失败返回数据"); } }); } } }, fail: function () { console.info ("设置失败返回数据"); } }); } else { wx.login({ success: function (res) { if (res.code) { wx.getUserInfo({ withCredentials: false, success: function (data) { console.info ("1成功获取用户返回数据"); console.info (data.userInfo); }, fail: function () { console.info ("1授权失败返回数据"); loginStatus = false; // 显示提示弹窗 wx.showModal({ title: ‘温馨提示‘, content: ‘您确定不授权[西厢房乡居生活]小程序吗?部分功能可能会收到影响‘, success: function (res) { if (res.confirm) { console.log(‘用户点击确定‘) } else if (res.cancel) { wx.openSetting({ success: function (data) { if (data) { if (data.authSetting["scope.userInfo"] == true) { loginStatus = true; wx.getUserInfo({ withCredentials: false, success: function (data) { console.info ("3成功获取用户返回数据"); console.info (data.userInfo); //更新数据 that.setData({ userInfo: data.userInfo, "openid": wx.getStorageSync(‘openid‘) }) // --------- 4、发起后台注册请求(私人定制) ------------------ wx.request({ url: ‘https://m.******.com/index.php/Home/Xiaoxxf/register ‘, data: { ‘nickName‘: data.userInfo.nickName, ‘openid‘: wx.getStorageSync(‘openid‘) }, header: { "Content-Type": "application/x-www-form-urlencoded" }, method: ‘POST‘, dataType: ‘JSON‘, success: function (res) { console.log(res.data); }, fail: function (res) { }, complete: function (res) { }, }) app.globalData.userInfo = that.data.userInfo; //用户所有信息放在globalData wx.setStorageSync(‘userInfo‘, that.data.userInfo.userInfo);//存储userInfo }, fail: function () { console.info ("3授权失败返回数据"); } }); } } }, fail: function () { console.info ("设置失败返回数据"); } }); } } }); } }); } }, fail: function () { console.info ("登录失败返回数据"); } }); } }
5、使用Demo:小程序JS
var app = getApp() var loginStatus = true var getPromisson = function(){ //--- 上面的方法体 ---- } Page({ onLoad: function () { var that = this //调用应用实例的方法获取全局数据,如果用户首次拒绝,那么这里的数据就是null app.getUserInfo(function (userInfo) { console.log(userInfo); //更新数据 that.setData({ userInfo: userInfo,//如果首次进入拒绝授权,那么这里==null,不要加引号‘‘ "openid":wx.getStorageSync(‘openid‘) }) }) if(that.data.userInfo==null){ getPromission(that); } } })
6、代码效果图: