uniapp微信小程序登陆流程(前端详细)

简介: 登陆逻辑先通过uni.getUserProfile()函数获取用户信息

登陆逻辑先通过uni.getUserProfile()函数获取用户信息

1024b19218af40c7a8a6290c6186518d.png

然后将uni.login()放在uni.getUserProfile()成功回调里面获取code

1024b19218af40c7a8a6290c6186518d.png

最后在uni.login登陆成功的回调里面向后端发送 code encryptedData iv 等信息


后端通过encryptedData iv来得到用户的解密所有信息,然后返回给前端,前端把这个信息存储下来实现登陆


先看几遍官方文档


小程序登录 | 微信开放文档


小程序登录 | 微信开放文档


前端代码 大致是这样,可以自己改改

login() {
    let that = this;
    uni.getUserProfile({
      desc: '用于完善用户资料',
      lang: 'zh_CN',
      success: (res) => {
      console.log(res)
      // that.wxlogin(res.userInfo);
      uni.login({
        success(codeData) {
        console.log(codeData)
        uni.showLoading({
          title: '登录中'
        });
        uni.request({
          url: myApi.loginUrl,
          data: {
          code: codeData.code,
          encryptedData: res.encryptedData,
          iv: res.iv,
          },
          method: 'GET',
          success(login) {
          uni.hideLoading();
          console.log(login)
          uni.showToast({
            title: '登陆成功去看打印',
            icon: 'none'
          })
          }
        })
        }
      })
      }
    });
    },


坑只能通过点击事件来调取,不能直接调取

1024b19218af40c7a8a6290c6186518d.png

无效调取

1024b19218af40c7a8a6290c6186518d.png


目录
相关文章
|
安全 算法 小程序
【03】微信支付商户申请下户到配置完整流程-微信开放平台创建APP应用-填写上传基础资料-生成安卓证书-获取Apk签名-申请+配置完整流程-优雅草卓伊凡
【03】微信支付商户申请下户到配置完整流程-微信开放平台创建APP应用-填写上传基础资料-生成安卓证书-获取Apk签名-申请+配置完整流程-优雅草卓伊凡
891 28
【03】微信支付商户申请下户到配置完整流程-微信开放平台创建APP应用-填写上传基础资料-生成安卓证书-获取Apk签名-申请+配置完整流程-优雅草卓伊凡
|
小程序
【04】微信支付商户申请下户到配置完整流程-微信开放平台移动APP应用通过-微信商户继续申请-微信开户函-视频声明-以及对公打款验证-申请+配置完整流程-优雅草卓伊凡
【04】微信支付商户申请下户到配置完整流程-微信开放平台移动APP应用通过-微信商户继续申请-微信开户函-视频声明-以及对公打款验证-申请+配置完整流程-优雅草卓伊凡
927 1
【04】微信支付商户申请下户到配置完整流程-微信开放平台移动APP应用通过-微信商户继续申请-微信开户函-视频声明-以及对公打款验证-申请+配置完整流程-优雅草卓伊凡
|
小程序
【01】微信支付商户申请下户到配置完整流程-微信商户申请-资料准备以及提交-微信商户密钥申请-申请+配置完整流程-优雅草卓伊凡
【01】微信支付商户申请下户到配置完整流程-微信商户申请-资料准备以及提交-微信商户密钥申请-申请+配置完整流程-优雅草卓伊凡
587 2
【01】微信支付商户申请下户到配置完整流程-微信商户申请-资料准备以及提交-微信商户密钥申请-申请+配置完整流程-优雅草卓伊凡
|
小程序 JavaScript 前端开发
微信小程序开发全流程:从注册到上线的完整指南
这篇文章详细记录了微信小程序的完整开发到最终上线的每一个步骤。适合对小程序开发感兴趣的个人开发者或希望了解完整流程的学习者,涵盖了云开发、事件绑定、生命周期管理、组件使用等关键内容。
16031 14
|
小程序 数据安全/隐私保护 开发者
【02】微信支付商户申请下户到配置完整流程-微信开放平台申请APP应用-微信商户支付绑定appid-公众号和小程序分别申请appid-申请+配置完整流程-优雅草卓伊凡
【02】微信支付商户申请下户到配置完整流程-微信开放平台申请APP应用-微信商户支付绑定appid-公众号和小程序分别申请appid-申请+配置完整流程-优雅草卓伊凡
1095 3
|
人工智能 小程序 搜索推荐
uni app下开发AI运动小程序解决方案
本文介绍了在小程序中实现AI运动识别的解决方案。该方案依托于UNI平台,通过高效便捷的插件形式,实现包括相机抽帧控制、人体识别、姿态识别等在内的多项功能,无需依赖后台服务器,大幅提高识别效率和用户体验。方案内置多种运动模式,支持自定义扩展,适用于AI健身、云上赛事、AI体测等多场景,适合新开发和存量改造项目。
|
移动开发 小程序
thinkphp+uniapp开发的多端商城系统源码/H5/小程序/APP支持DIY模板直播分销
thinkphp+uniapp开发的多端商城系统源码/H5/小程序/APP支持DIY模板直播分销
708 0
|
小程序 前端开发 JavaScript
在线课堂+工具组件小程序uniapp移动端源码
在线课堂+工具组件小程序uniapp移动端源码
387 0
在线课堂+工具组件小程序uniapp移动端源码
|
小程序 前端开发 算法

热门文章

最新文章

下一篇
开通oss服务