微信小程序如何获取openid及用户信息

1. 获取 openid

1.1 前置条件

在获取用户的 openid 之前，需要先完成小程序的注册和开通，然后获取到小程序的 AppID 和 AppSecret。

1.2 获取 code

用户在进入小程序后需要授权登录，获取到 code，如下所示：

wx.login({
  success(res) {
    if (res.code) {
      // 将 code 发送到后台以获取 openid
      console.log(res.code)
    } else {
      console.log('登录失败！' + res.errMsg)
    }
  }
})

注释：调用 wx.login 方法时会返回登录凭证 code，需要将该凭证发送到后台以获取 openid。

1.3 发送请求获取 openid

使用小程序的 AppID 和 AppSecret，结合第二步的 code 发送请求获取 openid，如下所示：

const appid = 'your appid'
const secret = 'your app secret'
const js_code = 'the code from login interface'
wx.request({
  url: `https://api.weixin.qq.com/sns/jscode2session?appid=${appid}&secret=${secret}&js_code=${js_code}&grant_type=authorization_code`,
  success(res) {
    console.log(res.data.openid) // openid 即为需要的用户唯一标识
  }
})

注释：请求中的 grant_type 为固定值 authorization_code，在请求成功后可以从返回结果中取到 openid。

2. 获取用户信息

2.1 获取用户信息前提

要获取到用户的头像、昵称等信息，需要先授权用户信息权限。在小程序中使用 button 标签引导用户授权信息，如下所示：

<button type="primary" bindgetuserinfo="getUserInfo">授权登录</button>

注释：调用 bindgetuserinfo 绑定的函数名为 getUserInfo。

2.2 获取用户信息

在得到用户授权后，可以通过 userinfo 获取用户信息，如下所示：

Page({
  data: {
    userInfo: {}
  },
  getUserInfo(res) {
    console.log(res.userInfo)
    const userInfo = res.userInfo
    this.setData({
      userInfo
    })
  }
})

注释：将获取到的用户信息存放到 data 中。

3. 总结

本文介绍了如何获取小程序中的 openid 和用户信息，其中获取 openid 需要先授权登录并获取 code，然后使用小程序的 AppID 和 AppSecret 发送请求获取 openid；获取用户信息需要先引导用户授权信息，然后在得到授权后，调用 userinfo 获取用户信息。