微信小程序的登录流程

更新: 9/4/2025字数: 0 字 时长: 0 分钟

---

小程序有两种登录方式，一种基于手机号码进行登录；

另一种是使用用户在公众号下的唯一标识（openid）进行登录(小程序是公众号的一种)。

主要流程图如下：

1、基于openid进行登录

1、 调用wx.login()获取code

  uni.login({
  success: async (res) => {
    if (res.errMsg === 'login:ok') {
      const { data } = await login({
        code: res.code,
      });
      // 保存用户信息
    }
  },
  fail(e) {
    uni.showToast({
      title: e.message,
    });
  },
});

2、 调用wx.request()请求登录接口，将code传到后台

3、 后台根据appid、secret、code获取openid

2、基于手机号码进行登录

1、 用户授权获取手机号

<template>
  <button
    class="login-btn"
    open-type="getPhoneNumber"
    @getphonenumber="getPhoneNumber"
  >
    手机号码登录
  </button>
</template>

<script>
export default {
  setup() {
    // 目前该接口针对非个人开发者，且完成了认证的小程序开放（不包含海外主体）
    const getPhoneNumber = (e) => {
      const { code, errMsg } = e.detail;
      if (errMsg === 'getPhoneNumber:ok') {
        const { data } = await loginByPhone({
          code,
        });
      } else {
        uni.showToast({
          title: errMsg,
        });
      }
    };

    return {
      getPhoneNumber,
    };
  },
};
</script>

2、 把手机号的code传到后台，获取服务端的token

3、 把token保存到本地，下次登录时直接取，无需再次授权

3、注意

1，获取手机号码是需要收费，每次调用需要 0.03 元。

2，wx.login与 getPhoneNumber中获取的 code 不是同一个