小程序登录流程

参考

app.js需要做的

1,首先通过wx.login()拿到code,成功之后,发送数据,请求接口,把code发送给后端,换区openid,sessionKey,unionId,把openid存起来

wx.login({
success: res => {
console.log(res) // 发送 res.code 到后台换取 openId, sessionKey, unionId }
})

2,接下来获取用户信息

wx.getSetting() 授权,如果授权成功了,直接调wx.getUserInfo() ,

wx.getSetting({
success: res => {
if (res.authSetting['scope.userInfo']) {
// 已经授权,可以直接调用 getUserInfo 获取头像昵称,不会弹框
wx.getUserInfo({
success: res => {
// 可以将 res 发送给后台解码出 unionId
this.globalData.userInfo = res.userInfo // 由于 getUserInfo 是网络请求,可能会在 Page.onLoad 之后才返回
// 所以此处加入 callback 以防止这种情况
if (this.userInfoReadyCallback) {
this.userInfoReadyCallback(res)
}
}
})
}
}
})

如果没有,在你首页把授权绑定在需要操作的按钮上

<button open-type="getUserInfo" lang="zh_CN" bindgetuserinfo="getUserInfo" plain='true' ></button>

执行自定义方法,然后把用户信息赋值给app.js里面的global userInfo,然后就没有然后了,剩下的就是普通掉接口,跑业务

补充一种小程序通过手机号微信授权拿到用户信息

<button class="{{allowed==1?'active':''}}" open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber" disabled="{{allowed == ''}}">获取</button>

getPhoneNumber(e){
console.log(e);
if(e.detail.errMsg=='getPhoneNumber:ok'){
httpData.getunionid({
openid:wx.getStorageSync("openid"),
encryptedData:e.detail.encryptedData,
iv: e.detail.iv
}).then(res=>{
console.log("dd",res)
wx.setStorageSync("unionid", res.data.data); //这里返回用户信息userInfo,命名比较随意不用介意
app.globalData.unionid = res.data.data;
wx.reLaunch({
url: '/pages/index/index',
})
})
}
},

解释下openid是我在app.js里面获取的(通过wx.login获取code,在调用后端接口获取openid)

微信小程序登录流程的更多相关文章

  1. 微信小程序登录流程及解析用户openid session_key,获取用户信息

    为优化用户体验,使用 wx.getUserInfo 接口直接弹出授权框的开发方式将逐步不再支持.从2018年4月30日开始,小程序与小游戏的体验版.开发版调用 wx.getUserInfo 接口,将无 ...

  2. 微信小程序--登录流程梳理

    前言 微信小程序凡是需要记录用户信息都需要登录,但是也有几种不同的登录方式,但是在小程序部分的登录流程是一样的.之前就朦朦胧胧地用之前项目的逻辑改改直接用了,这个新项目要用就又结合官方文档重新梳理了下 ...

  3. 微信小程序登录流程解析

    小程序可以通过微信官方提供的登录能力方便地获取微信提供的用户身份标识openid,快速建立小程序内的用户体系. 登录流程时序: 1.首先,调用 wx.login获取code ,判断用户是否授权读取用户 ...

  4. 微信小程序 登录流程规范解读

    一. 官方登录时序图 二. 简单理解 这里仅按照官方推荐的规范来 0. 前置条件 一共有三端: - 微信小程序客户端 - 第三方服务器端(自己搭建) - 微信服务器端 1. 客户端获得code,并将c ...

  5. Spring Security 整合 微信小程序登录的思路探讨

    1. 前言 原本打算把Spring Security中OAuth 2.0的机制讲完后,用小程序登录来实战一下,发现小程序登录流程和Spring Security中OAuth 2.0登录的流程有点不一样 ...

  6. 微信小程序开发流程

    2017年1月9日,张小龙在2017微信公开课Pro上发布的小程序正式上线,一夜之间,小程序可谓家喻户晓,但通过接下来的几个月的观察,微信小程序并没有想象中的那么火爆.进入4月以来,微信小程序团队进行 ...

  7. 基于Shiro,JWT实现微信小程序登录完整例子

    小程序官方流程图如下,官方地址 : https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/login.html ...

  8. 微信小程序登录JAVA后台

    代码地址如下:http://www.demodashi.com/demo/12736.html 登录流程时序登录流程时序 具体的登录说明查看 小程序官方API 项目的结构图: springboot项目 ...

  9. 微信小程序登录对接Django后端实现JWT方式验证登录

    先上效果图 点击授权按钮后可以显示部分资料和头像,点击修改资料可以修改部分资料. 流程 1.使用微信小程序登录和获取用户信息Api接口 2.把Api获取的用户资料和code发送给django后端 3. ...

随机推荐

  1. POJ3094 Quicksum

    POJ3094 Quicksum Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 18517   Accepted: 1271 ...

  2. 学习Xen

    先找到两个大佬博客 进行学习 http://www.cnblogs.com/BloodAndBone/archive/2010/11/02/1866907.html https://www.cnblo ...

  3. Django基础模板层(75-76)

    Django框架之模板层(d75)一 模版语法之变量: ** locals() 会把*该*视图函数内的变量,传到模板    ** return render(request, 'index.html' ...

  4. 可编辑的div -> 编辑框

    操作可编辑的div中,无可厚非,怎么获取当前光标位置,复制,粘贴等知识是必须要懂得,下边这个链接里面对其有详细的解释: 请点这里 想看详细的例子请点击这里

  5. HTML5+CSS3(3)

    一.CSS3新增属性用法整理 1.box-shadow(阴影效果) 2.border-color(为边框设置多种颜色) 3.border-image(图片边框) 4.text-shadow(文本阴影) ...

  6. 实战ELK(8) 安装ElasticSearch中文分词器

    安装 方法1 - download pre-build package from here: https://github.com/medcl/elasticsearch-analysis-ik/re ...

  7. 【perl】企业微信发消息

    https://open.work.weixin.qq.com/api/doc#90000/90135/90236 #!/usr/bin/env perl use strict; use warnin ...

  8. 宝塔面板配置阿里云SSL证书流程

    阿里云SSL证书申请过程就不在这里说了 1 先下载阿里云成功申请的SSL证书 解压后 有3个文件 2  找到宝塔面板的 站点设置  找到SSL设置 3 找到其他证书 用文本打开.key文件  复制里面 ...

  9. SpringMVC参数注解解释

    在Controller的开发中,经常会用到很多注解,下面解释一下关于形参常用注解的一些解释,他们主要是用来接收参数的. @ModelAttribute("vo", ObjectVo ...

  10. junit,面向切面开发(动态代理),工厂设计模式,数据库连接池

    1.junit junit又叫单元测试,好处是能进行批量测试,而且如果方法出现了问题能立刻定位出出现问题的方法,还有一个好处是感官效果很好,如果方法都通过了则显示绿条,否则显示红条 TestCase. ...