一、获取OPENID

1.获取授权码code

调用接口获取登录凭证（code）进而换取用户登录态信息，包括用户的唯一标识（openid） 及本次登录的会话密钥（session_key）。用户数据的加解密通讯需要依赖会话密钥完成。

// 登录
wx.login({
  success: res => {
    console.log(res)
    // 发送 res.code 到后台换取 openId, sessionKey, unionId
  }
})

2.获取openid

拿到上一步获取的code，结合小程序 appid 和 secret 请求接口：

`https://api.weixin.qq.com/sns/jscode2session?appid=${_this.globalData.AppID}&secret=${_this.globalData.AppSecret}&&js_code=${res.code}&grant_type=authorization_code`

换取openid，与 openid 一同被返回的，还包括 session_key，其中 session_key 是对用户数据进行加密签名的密钥。为了自身应用安全，session_key 不应该在网络上传输。

二、自动获取用户信息

1.自动弹框用户确认

1.1 在app.js中创建该全局方法

// app.js
App({
  onLaunch() {
    // 展示本地存储能力
    const logs = wx.getStorageSync('logs') || []
    logs.unshift(Date.now())
    wx.setStorageSync('logs', logs)

    // 登录
    wx.login({
      success: res => {
        // 发送 res.code 到后台换取 openId, sessionKey, unionId
      }
    })
  },
  //app.js
  getUserInfo:function(cb){
    var that = this
    if(that.globalData.userInfo){
      typeof cb == "function" && cb(that.globalData.userInfo)
    }else{
      //调用登录接口
      wx.showModal({
        title: '温馨提示',
        content: '正在请求获取您的个人信息，以后续方便使用本程序！',
        success(res) {
          if (res.confirm) {
            wx.getUserProfile({
              desc: "获取你的昵称、头像、地区及性别",
              success: res => {
                that.globalData.userInfo = res.userInfo
                typeof cb == "function" && cb(that.globalData.userInfo)
              },
              fail: res => {
                //拒绝授权
                that.showErrorModal('您拒绝了请求');
                return;
              }
            })
          } else if (res.cancel) {
            //拒绝授权 showErrorModal是自定义的提示
            that.showErrorModal('您拒绝了请求');
            return;
          }
        }
      })
    }
  },
  globalData: {
    userInfo: null
  }
})

1.2 实例化全局方法获取用户信息

onLoad() {
  var that = this
  app.getUserInfo(function (userInfo) {
    console.log(userInfo)
    //更新数据
    that.setData({
      userInfo: userInfo
    })
  })
}

2.open-data

<block wx:if="{{canIUseOpenData}}">
  <view class="userinfo-avatar" bindtap="bindViewTap">
    <open-data type="userAvatarUrl"></open-data>
  </view>
  <open-data type="userNickName"></open-data>
</block>

三、手动获取用户信息

1.button 弹框

<block wx:elif="{{!hasUserInfo}}">
  <button wx:if="{{canIUseGetUserProfile}}" bindtap="getUserProfile"> 获取头像昵称 </button>
  <button wx:elif="{{canIUse}}" open-type="getUserInfo" bindgetuserinfo="getUserInfo"> 获取头像昵称 </button>
</block>

getUserProfile(e) {
  // 推荐使用wx.getUserProfile获取用户信息，开发者每次通过该接口获取用户个人信息均需用户确认，开发者妥善保管用户快速填写的头像昵称，避免重复弹窗
  wx.getUserProfile({
    desc: '展示用户信息', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
    success: (res) => {
      console.log(res)
      
      this.setData({
        userInfo: res.userInfo,
        hasUserInfo: true
      })
    }
  })
},