[拆弹时刻]4月13日前更新wx.getUserInfo和getUserProfile授权获取问题的解决方案 - WXOPEN Club

论坛里有不少人疑惑新版的getUserProfile是不是已经上，同时发现开发环境中原有的老方法已经不支持了，这里我为大家集中解决下疑惑~

1、线上是否已经不支持wx.getUserInfo老方法了？

支持！目前，根据官方文档说明：在4月13日前发布的，线上环境__2.16.0基础库以下已经不支持老版方法。（4月8日更新，怀疑官方已提前发布）__

本人今天4月6日10点半线上支持老方法，__但是4月8日__发布2.16.0以下低版本已经去掉弹窗授权了。请大家尽快更新发布新版方法

2、哪些环境已经是新方法了？

开发环境（包括但不限于IDE工具，真机调试），微信后台提供的__体验版__环境，且已不支持老办法。

3、新老两种方法是否并行？

线上环境：目前并行（4月13日前），但getUserProfile新方法只在2.10.4以上版本支持。

开发环境和体验版：不并行，不支持__左右横跳__哈。

4、如何解决兼容性适配？

上才艺啦，呸，上代码。

先来看下原本代码的授权逻辑

//老的逻辑
wx.getSetting({
    async success(res) {
        console.log(res.authSetting);
        //判断小程序用户是否授权
        if (res.authSetting['scope.userInfo']) {
            //已授权  
        } else {
            //未授权情况
        }
    }
})

之前主要通过wx.getSetting的方法来判断，而现在重大的改变是老方法getUserInfo不再弹窗，就算改成getUserProfile弹窗授权，新方法中getSetting中__scope.userInfo 这个值并没有返回__（这里跟文档有些出入，不知道官方后面会不会修正）

同时，这里需要做__兼容判断__，把获取到内容__存在数据库中__，避免反复弹窗骚扰用户。

//根据官方文档 做了一些修改
Page({
  data: {
    userInfo: {},
    hasUserInfo: false,
    canIUseGetUserProfile: false,
  },
  onLoad() {
    //先请求自定义接口，获取上次存的useInfo
    wx.request({
      url: 'test.api', //仅为示例，并非真实的接口地址
      data: {},
      success (res) {
        console.log(res.useInfo)
        //判断之前是否已获取并存储过用户信息
        if(res.useInfo){
            
        }else {
            //这里不要使用 wx.canIuse来判断，避免一些适配问题
            if (wx.getUserProfile) {  //直接使用官方推荐的方法
              this.setData({
                canIUseGetUserProfile: true
              })
            }
        }
      }
    })
  },
  getUserProfile(e) {
    // 推荐使用wx.getUserProfile获取用户信息，开发者每次通过该接口获取用户个人信息均需用户确认
    // 开发者妥善保管用户快速填写的头像昵称，避免重复弹窗
    wx.getUserProfile({
      desc: '需要你的信息', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
      success: (res) => {
        //这里需要将获取的 res.userInfo 存起来，你可以存在数据库，也可以存在local storage里
        //wx.request...请求接口
        this.setData({
          userInfo: res.userInfo,
          hasUserInfo: true
        })
      }
    })
  },
  getUserInfo(e) {
    // 不推荐使用getUserInfo获取用户信息，预计自2021年4月13日起，getUserInfo将不再弹出弹窗，并直接返回匿名的用户个人信息
    this.setData({
      userInfo: e.detail.userInfo,
      hasUserInfo: true
    })
  },
})

<!-- html部分 --->
<block wx:if="{{!hasUserInfo}}">
  <button wx:if="{{canIUseGetUserProfile}}" bindtap="getUserProfile"> 获取头像昵称 </button>
  <button wx:else open-type="getUserInfo" bindgetuserinfo="getUserInfo"> 获取头像昵称 </button>
</block>
<block wx:else>
  <image bindtap="bindViewTap" class="userinfo-avatar" src="{{userInfo.avatarUrl}}" mode="cover"></image>
  <text class="userinfo-nickname">{{userInfo.nickName}}</text>
</block>