粗略讲一下uniapp 中第三方小程序登录的过程做个大概笔记

这里先只讲 第三方的小程序登录过程 理解透了登录过程 就可以脱离官方的uniapp 随便浪了 uniapp插件市场那么多的模板就可以随便玩了。

先从官方的uniapp 解读

pages\authorize\components\wx-mini.nvue

粗略讲一下uniapp 中第三方小程序登录的过程做个大概笔记

页面加载的时候就调用小程序登录

获取到code后执行 fastLogin

粗略讲一下uniapp 中第三方小程序登录的过程做个大概笔记

这里是最关键的地方,post 数据到 index.php/index/wxapp.login/wxapp_getuser_bycode.html 

粗略讲一下uniapp 中第三方小程序登录的过程做个大概笔记

观察请求就可以发现 在header 中发送了当前小程序的 wxappid  post数据中发送了code.

我们基本不需要管index.php/index/wxapp.login/wxapp_getuser_bycode.html 中的代码是怎么写的。

只需要知道当返回的code 不为0的时候就是新用户。

他执行的是

粗略讲一下uniapp 中第三方小程序登录的过程做个大概笔记

uni.navigateTo({
url: '/pages/common/web?url='+encodeURIComponent(config.domain+'/index.php/index/wxapp/iframe_login.html?openid='+this.openid+'&qun_wxapp_appid='+config.wxappid+'&backurl='+encodeURIComponent('/pages/authorize/login?from=www')+'&jumptype=&' ), //如果返回主页的话,要设置 jumptype=tab
});

这里的大概意思就是 

当是新用户的时候就跳转到 套壳的 /pages/common/web 访问 index.php/index/wxapp/iframe_login.html做账户捆绑操作 返回跳转到/pages/authorize/login?from=www 再继续执行登录  这里是关键点 要继续执行登录不然就是未登录

父子传值就不说了 不懂的可以啃VUE文档 

官方的讲解完了 那么我们随便换一个uni的风格框架进行测试。

为了有区别 可以看的更明白 我们这里做成点击登录的按钮

粗略讲一下uniapp 中第三方小程序登录的过程做个大概笔记

粗略讲一下uniapp 中第三方小程序登录的过程做个大概笔记

当新用户的时候 我们把from 赋值了  所以他会直接执行重新登录过程

粗略讲一下uniapp 中第三方小程序登录的过程做个大概笔记

这里仅仅是讲登录过程 

在换uni的过程中 需要注意的是 第一个就是  每次请求header 都有 wxappid 需要登录访问的需要header 要带我们登录后获得的token

视频未完全接入会员系统 所以 只能判断是不是登录了 没有获取信息呢

 0:00 / 00:14

速度

*循环

00:00

上一篇:技术人攻略访谈三十六|马鉴:玩Flash十五年,养出一只“神经猫”


下一篇:【uniapp-推荐阿里巴巴矢量图www.iconfont.cn】基于阿里巴巴矢量图标如何导入uniapp总结