小程序不同方式获取用户信息的应用场景

小程序中有多种方式获取用户信息，方式不同，应用场景不同

• 方式一：仅仅只是展示自己的用户信息 ，可以用open-data来展示微信开放的数据

这种方式的特点是，只用于放在wxml里展示信息，而且只能用于展示自己微信的信息。不能得到别人的微信信息。不需要授权。

// 拉取群名称
<open-data type="groupName" open-gid="xxxxxx"></open-data>  

// 展示用户头像
<open-data type="userAvatarUrl"></open-data>

// 展示用户性别
<open-data type="userGender" lang="zh_CN"></open-data>

// 展示用户昵称
<open-data type="userNickName"></open-data>

// 还有其他开放数据，可以看文档
。。。。

• 方式二：如果想在JS里获取用户信息，把这些信息放入对应数据库或者后边的开发需要用到这些信息。

使用 wx.getUserInfo的前提是要先判断用户是否授权，只有授权的用户才可以通过调用wx.getUserInfo获取到用户信息

// JS里调用 
    // wx.getUserInfo({
    //   success:(res)=>{
    //     console.log(res.userInfo)
    //   }
    // })

    wx.getSetting({
      success:(res)=>{
        console.log(res)
        if(res.authSetting['scope.userInfo']){
          // 已授权 ，就获取用户信息
          wx.getUserInfo({
            success: (res) => {
              console.log(res)
            }
          })
        }else{
          // 未授权
          do sth...
        }
      }
    })

• 方式三：(推荐方式)弹出一个授权框，由用户决定是否授权给当前小程序获取用户信息的权力

// 除了onGetUserInfo是自定义的方法名，其他都是固定写法
<button open-type="getUserInfo" bindgetuserinfo="onGetUserInfo">获取用户信息</button>

然后点击按钮的时候，如果用户还没有授权，会弹出授权框

image.png
点击允许后，就可以在JS里，通过自定义方法onGetUserInfo的参数event来获取用户信息了

  onGetUserInfo(event){
    console.log(event.detail.userInfo)
  },

button按钮，可以实现多种开放能力

image.png

• 方式四：第三种方式虽然获取了用户信息，但是不包括用户的唯一标识openId，如果想要获取这个唯一表示，分两种情况

1. 传统微信登录，微信后台不是用云开发方式写的，而是用java,php等语言写的；步骤如下
   a. 用户端小程序先调用wx.login到微信服务器获取code
   b. 用户端小程序调用wx.request将code传给后端服务器
   c. 后端服务器使用code到微信服务器换取openId和session_key
   d. 后端服务器将获取的用户标识发送给小程序本地存储
   image.png
2. 云开发模式，我们使用任何云函数的时候，都可以获取用户唯一标识

exports.main = async (event, context) => {
  // 获取 WX Context (微信调用上下文)，包括 OPENID、APPID、及 UNIONID（需满足 UNIONID 获取条件）等信息
  const wxContext = cloud.getWXContext()

  return {
    event,
    openid: wxContext.OPENID,
    appid: wxContext.APPID,
    unionid: wxContext.UNIONID,
    env: wxContext.ENV,
  }
}

image.png