OhPlay/pages/login/login.vue

<template>
  <view class="login">
    <button
      type="default"
      open-type="getPhoneNumber"
      @getphonenumber="decryptPhoneNumber"
      @click="login"
    >
      微信授权一键登录
    </button>
  </view>
</template>

<script>
import { saveToken } from "../../Lib/Request";
export default {
  components: {},
  data: () => ({
    openid: null,
    phoneInfo: null,
  }),
  computed: {},
  methods: {
    login() {
      let that = this;
      //获取openid
      uni.login({
        provider: "weixin",
        success: function (loginRes) {
          console.log(`uni.login errMsg = ${loginRes.errMsg}`);
          if (loginRes.code) {
            //调用登录接口
            that
              .$request({
                server: 2,
                servant: 10005,
                data: {
                  code: loginRes.code,
                },
              })
              .then((result) => {
                console.log(result);
                if (result.code === 0) {
                  if (result.data.token && result.data.id) {
                    //保存token
                    saveToken(result.data.token, result.data.id);
                  } else {
                    that.openid = result.data.openid;
                    //获取token
                    that.getToken();
                  }
                } else {
                  uni.showToast({
                    title: result.msg,
                    duration: 2000,
                    icon: "none",
                  });
                }
              })
              .catch((err) => {
                console.log(err);
              });
          } else {
            uni.showToast({
              title: loginRes.errMsg,
              duration: 2000,
              icon: "none",
            });
          }
        },
        fail(err) {
          console.log(err);
        },
      });
    },
    //获取手机号码
    decryptPhoneNumber(e) {
      console.log(e.detail);
      if (e.detail.errMsg == "getPhoneNumber:ok") {
        console.log(e.detail.iv);
        console.log(e.detail.encryptedData);
        this.phoneInfo = {
          encryptedData: e.detail.encryptedData,
          iv: e.detail.iv,
        };
        //获取token
        this.getToken();
      } else {
        uni.showToast({
          title: "用户拒绝权限",
          duration: 2000,
          icon: "none",
        });
      }
    },
    //获取uuid和token
    getToken() {
      console.log(this.openid);
      console.log(this.phoneInfo);
      if (this.openid && this.phoneInfo) {
        console.log("getToken");
        const platform = uni.getSystemInfoSync().platform;
        let systemType;
        switch (platform) {
          case "ios":
            systemType = 1;
            break;
          case "android":
            systemType = 2;
            break;
          default:
            systemType = 3;
            break;
        }
        const openid = this.openid;
        const iv = this.phoneInfo.iv;
        const phone = this.phoneInfo.encryptedData;
        //清除数据避免重复调用
        this.openid = null;
        this.phoneInfo = null;
        this.$request({
          server: 2,
          servant: 10003,
          data: {
            type: 1,
            openid,
            phone,
            systemType,
            iv,
          },
        })
          .then((result) => {
            console.log(result);
            if (result.code === 0) {
              if (result.data.token && result.data.id) {
                //保存token
                saveToken(result.data.token, result.data.id);
              }else{
                uni.showToast({
                title: 'token 或者uid为空',
                duration: 2000,
                icon: "none",
              });
              }
            } else {
              uni.showToast({
                title: result.msg,
                duration: 2000,
                icon: "none",
              });
            }
          })
          .catch((err) => {
            console.log(err);
          });
      }
    },
  },
  watch: {},

  // 页面周期函数--监听页面加载
  onLoad() {},
  // 页面周期函数--监听页面初次渲染完成
  onReady() {},
  // 页面周期函数--监听页面显示(not-nvue)
  onShow() {},
  // 页面周期函数--监听页面隐藏
  onHide() {},
  // 页面周期函数--监听页面卸载
  onUnload() {},
  // 页面处理函数--监听用户下拉动作
  onPullDownRefresh() {
    uni.stopPullDownRefresh();
  },
  // 页面处理函数--监听用户上拉触底
  onReachBottom() {},
  // 页面处理函数--监听页面滚动(not-nvue)
  /* onPageScroll(event) {}, */
  // 页面处理函数--用户点击右上角分享
  /* onShareAppMessage(options) {}, */
};
</script>

<style></style>