微信小程序中获取用户信息getUserInfo替换方案

场景说明

我们在开发过程中，如果使用getUserInfo获取用户头像和昵称等用户信息时，会出现如下报错：

(in promise) MiniProgramError
{"errMsg":"getUserInfo:fail scope unauthorized"}
Object

这是因为官方调整了获取用户信息的方法，详见https://developers.weixin.qq.com/community/develop/doc/0000a26e1aca6012e896a517556c01，在小程序中有两种替代方案

• （1）获取用户基本信息：1、使用 button 组件，并将 open-type 指定为 getUserInfo 类型,（点击查看详情）。
• （2）展示用户基本信息：使用 open-data，（点击查看详情）

其目的可能主要是为了显示的让用户在点击操作时提示用户去授权，而不是类似进入小程序首页或其他任意场景下提示。具体解决方案的示例代码如下：

1、使用button组件获取用户信息

（taro版）

// 判断是否已授权，可用于是否需要展示授权按钮
componentDidMount () {
    Taro.getSetting().then((res)=>{
      if (res.authSetting['scope.userInfo']) {
        // 已经授权，可以直接调用 getUserInfo 获取头像昵称
        Taro.getUserInfo().then(result=>{
            console.log(result.userInfo);
            this.setState({
                userInfo
            })
        })
      }
    })
}

// 用户授权后 获取用户信息
bindGetUserInfo(e){
    console.log(e.detail.userInfo);
    if (e.detail.userInfo) {
        this.setState({
            userInfo
        })
    }
}

// 这里需要注意 原来的bindGetUserInfo 事件在taro修改为 onGetuserinfo 
授权登录

原生小程序也类似：

onLoad: function() {
    // 查看是否授权
    wx.getSetting({
      success: function(res){
        if (res.authSetting['scope.userInfo']) {
          // 已经授权，可以直接调用 getUserInfo 获取头像昵称
          wx.getUserInfo({
            success: function(res) {
              console.log(res.userInfo)
            }
          })
        }
      }
    })
},

bindGetUserInfo: function(e) {
    console.log(e.detail.userInfo)
}

<button open-type="getUserInfo" bindgetuserinfo="bindGetUserInfo">授权登录</button>

这样用户授权后，即可拿到用户信息数据，并做后续的处理逻辑。

2、使用 open-data 展示用户信息

方法1是为了获取用户信息，进行逻辑处理，如果只是为了展示用户信息的话，就可以用 open-data: