Uni-app云开发 微信小程序获取openid与用户信息

开发环境：微信开发者、微信云开发、HBuilderX、uniCloud等。
（此文已默认对以上开发环境有基础的使用了解。）
（文中大部分注释是自己的思考和理解，如果阅读时觉得混乱，可选择性忽略，只看代码就好。）

1. 获取openid

1.1 效果图

1.2 逻辑思路

用HBuilderX选择在微信开发者调试时，只要提前填上微信appid、开通了微信云开发，微信的云空间就会提供一个获取openid的云函数。
在App.vue的onLaunch()函数中使用getOpenId()即可获得openid。

不一定是getOpenId()这个函数名，也有可能叫login()，具体名称要自己查看。

1.2 实现代码

1.2.1 App.vue页面

App.vue页面，一进入小程序就开始获取openid：

<script>
  export default {
   
    onLaunch: function() {
   
      console.log('App Launch')
      // 第一步：初始化微信云函数
      wx.cloud.init({
   
        env: '填写微信云开发环境ID',  // 打开微信云开发控制平台，右上角点击[设置] - [环境设置] 
        traceUser: true
      }),
      // 第二步：获取用户的openid
      wx.cloud.callFunction({
   
        name: 'getOpenId',	 // 打开微信云开发控制平台，左上角点击[云函数]
        data: {
   },
        success: res => {
   
          // debugger
          // 第三步(可省略)：缓存用户openid，方便后续再次调用
          wx.setStorage({
   
            key: "user",
            data: res.result.openid
          })
          console.log('成功获取openid: ', res.result.openid)
        },
        fail: err => {
   
          console.error('获取失败：', err)
        }
      })
    },
  }
</script>

2. 获取用户信息（按钮授权）

2.1 效果图

2.2 逻辑思路

备注1：流程图中的“初始化自定义用户数据变量”，指的是除了用户的头像昵称性别等基本信息外，还因开发需求而增加了一些“自定义”的用户变量。比如一条用户记录的结构是：

图中的第五项score就是我自定义的用户属性，需要自己赋值初始化。
上图的用户数据集合，将存储在uniCloud中。

备注2： 使用openid查询用户数据，意思是，使用此前获得的openid，到uniCloud中自己创建的user集合中查找。如果找得到此用户的openid，表示此用户已存在；找不到此用户的openid，表示此用户为新用户，需要在user集合中插入新数据。

2.3 实现代码

2.3.1 index.vue页面的template部分

template部分：

<template>
  <view id="content">
    <button v-if="!hasUserInfo" open-type="getUserInfo" @getuserinfo="getuserinfo">授权登录</button>