2021年啦，微信小程序最新登录以及授权方法解析，给新手小白的~

 <view class="userinfo">
    <!-- 这里的hasUserInfo主要是为了判断用户是否已经授权，如果没有授权过就展示获取头像昵称按钮 -->
    <block wx:if="{{!hasUserInfo}}">
      <!--canIUseGetUserProfile判断当前版本是否支持wx.getUserProfile方法-->
      <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>
 </view>

Page({
  data: {
    userInfo: {},//默认为空，但是进入页面我们需要先请求后台接口判断用户是否已经授权过信息，没有获取到的情况下我们需要提醒新用户授权
    hasUserInfo: false,//判断是否展示授权按钮/授权弹窗或者跳到授权页面
    canIUseGetUserProfile: false,//是否支持wx.getUserProfile方法
  },
  onLoad() {
    //进入页面判断是否可以使用wx.getUserProfile
    if (wx.canIUse('getUserProfile')) {
      this.setData({
        canIUseGetUserProfile: true
      })
    }
  },
  getUserProfile(e) {
    // 推荐使用wx.getUserProfile获取用户信息，开发者每次通过该接口获取用户个人信息均需用户确认
    // 开发者妥善保管用户快速填写的头像昵称，避免重复弹窗
    wx.getUserProfile({
      desc: '用于完善会员资料', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
      success: (res) => {
        this.setData({
          userInfo: res.userInfo,
          hasUserInfo: true
        })
      }
    })
  },
  getUserInfo(e) {
    // 不推荐使用getUserInfo获取用户信息，预计自2021年4月13日起，getUserInfo将不再弹出弹窗，并直接返回匿名的用户个人信息
    this.setData({
      userInfo: e.detail.userInfo,
      hasUserInfo: true
    })
  },
})

 <button bindtap="getUserProfile"> 获取头像昵称 </button>

 getUserProfile(e) {
    wx.getUserProfile({
      desc: '用于完善会员资料', 
      success: (res) => {
        this.setData({
          userInfo: res.userInfo
        })
      }
    })
  },

<button open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber"></button>

Page({
  getPhoneNumber (e) {
    console.log(e.detail.errMsg)
    console.log(e.detail.iv)//加密算法的初始向量
    console.log(e.detail.encryptedData)//包括敏感数据在内的完整用户信息的加密数据
  }
})

 getPhoneNumber: function (e) {
    var that = this;
    //检查session-key是否过期
    wx.checkSession({
      success() {
        wx.login({
          success: res => {
            wx.request({
              url: '写你自己的接口地址/' + res.code,
              method: 'GET',
              header: {
                'content-type': 'application/xml'
              },
              success: function (res) {
                if (res.data.code == 200) {
                  //是否允许获取手机号
                  if (e.detail.errMsg == "getPhoneNumber:ok") {
                    //这里是因为后台让我把参数拼接在url上给他，大家最好用data来传，别学我（气哭）
                    wx.request({
                      url: '写自己的接口地址?enData=' + e.detail.encryptedData + '&iv=' + e.detail.iv + '&sessionKey=' + res.data.data.session_key,
                      method: "POST",
                      success: function (res) {
                        if (res.data.code == 200) {
                          console.log(res.data.data.phone);
                        }
                      }
                    })
                  }
                }
              }
            })
          }
        })
      }
    })
  },