微信登录流程

最新推荐文章于 2023-02-11 07:10:26 发布

weixin_45169791

最新推荐文章于 2023-02-11 07:10:26 发布

阅读量306

点赞数

分类专栏：微信小程序登录文章标签：微信小程序

本文链接：https://blog.csdn.net/weixin_45169791/article/details/126740835

版权

微信小程序登录专栏收录该内容

1 篇文章 0 订阅

订阅专栏

微信登录已经接了好多次了，但是每次对接都不是很顺利，所以今天我要整理一番。

（1）先获取登录的code

getCode  () {

  uni.login({

      success (loginRes) {

    /* wx登录 */

    console.log(loginRes.code + '登录的code')
    
    that.code = loginRes.code

    }

    })
    return  that.code

}

（2）获取用户信息

async getUserProfile （） {

  await this.getCode

  uni.getUserProfile({

     desc: '用于完善会员资料', // 声明获取用户个人信息后的用途，后续会展示在弹窗中， 请谨慎填写
     
     success(res) {
       conslole.log（res.userInfo+ '用户信息" ）//这里面的内容是需要传给后端
       that.requestLogin(); //将code和用户信息传给后端
     },
     fail(err) {
      console.log('用户拒绝授权', err);
     }
  });
}

//请求后端登录接口
async requestLogin () {
    const resp = await queryWechatLogin({
        appid: config.appId, //小程序APPid 
        code: this.code //登录code，
        ...userInfo //用户信息,
        mobileCode: this.mobileCode, //手机号code 没有则为空 后端会进行判断

    })
    //后端会告诉我们该code的用户是否存在数据库中，如果用户之前已经授权手机号登录过小程序，那么无需                                                在重新获取手机号登录，可直接登录
    if(resp.success){
        let type = resp.data.type;
        if(type == 0){
            this.dialogShow = true //获取手机号授权弹框
        } else{
            conslole.log(resp.token + '用户token')
            //后端直接返回token
        }
    }
}
//获取手机号code
//通过官方按钮组件，传入open-type="getPhoneNumber
"<button class="btn confirm-btn" open-type="getPhoneNumber" @getphonenumber="getUserPhone">确认授权</button>
async getUserPhone (info){
    this.mobileCode = info.detail.code
    await this.getCode(true);
    this.requestLogin ()
    //到这里登录就结束拉
}

然后有个特别需要注意的是，在开发者工具调试登录时，首页你必须是所属小程序的开发者，不然授权登录会返回，这个提示错误代码：40029, 错误信息：code 无效。

顺便提一嘴后端写登录接口是需要我们提供小程序appid和secret（密钥）.....

官方文档入口：小程序登录 | 微信开放文档 (qq.com)