返回

微信小程序生产环境体验版无法获取 openID 的坑

前端

啊哈，哈喽大家好！我是程序员小李，今天我将带着大家一起探讨一个小程序生产环境体验版无法获取 openID 的大坑。话不多说，请听我细细道来。

问题的表象

在小程序的开发环境中，无论是使用真机调试还是小程序开发者工具直接测试，都能轻松获得 openID。然而，一旦将代码上传并使用小程序的体验版进行测试，openID 就像人间蒸发了一样，踪迹全无。

神坑现身

更诡异的是，如果在体验版开启调试模式，居然又可以获得 openID 了。这简直就是一个反人类的操作，严重影响了开发环境的调试效率。

问题的根源

经过一番抽丝剥茧，我终于找到了问题的根源：体验版和正式版在获取 openID 的机制上存在差异。在体验版中，由于安全限制，无法直接获取用户的 openID。需要用户手动点击「登录」按钮，授权小程序获取 openID。

解决办法

既然知道了问题的根源，那解决起来就相对简单了。我们需要在体验版中添加一个「登录」按钮，提示用户授权小程序获取 openID。授权成功后，即可正常获取 openID。

如何添加「登录」按钮

在小程序的「app.js」文件中，添加如下代码：

Page({
  data: {
    isLogin: false,
  },
  onLoad: function () {
    wx.login({
      success: (res) => {
        if (res.code) {
          // 获取 openID
          wx.request({
            url: 'https://example.com/api/get_openid',
            data: {
              code: res.code,
            },
            success: (res) => {
              if (res.data.openid) {
                this.setData({
                  isLogin: true,
                });
              }
            },
          });
        }
      },
    });
  },
  onLogin: function () {
    wx.login({
      success: (res) => {
        if (res.code) {
          // 获取 openID
          wx.request({
            url: 'https://example.com/api/get_openid',
            data: {
              code: res.code,
            },
            success: (res) => {
              if (res.data.openid) {
                this.setData({
                  isLogin: true,
                });
              }
            },
          });
        }
      },
    });
  },
});

在小程序的页面中，添加如下代码：

<button type="primary" bindtap="onLogin">登录</button>

注意：

结语

好了，以上就是解决微信小程序生产环境体验版无法获取 openID 问题的完整解决方案。希望这篇博客对大家有所帮助。最后，别忘了点赞、收藏、转发，让更多人受益。谢谢大家！