小程序登录流程 _小程序

一、登录原理
1、调用wx.login获得 code

WXML

// 第1步：微信登录, 得到code wxlogin() { wx.login({ success: (res) => { console.log("微信登录", res); this.setData({ code: res.code }) }, fail(err) { console.log(err); } }) },2、获取客户信息,wx.getUserInfo (要先授权), 获得 encryptedData,iv

文章插图

官方文档说明
（因为微信官方考虑到用户隐私，所以关闭了用户进入小程序时自动弹出获取用户信息的接口，只能通过button绑定getuserinfo事件来获取用户信息）

WXML

【小程序登录流程】<view> <text>第2步：</text> <button type="warn" open-type="getUserInfo" bindgetuserinfo="getUserInfo" size="mini"> 获取用户授权信息 </button></view>

// 第2步：获取用户授权信息，得到encryptedData，iv getUserInfo(event) { console.log("用户授权信息", event.detail); let detail = event.detail; this.setData({ encryptedData: detail.encryptedData, iv: detail.iv }) },3、调用login接口,传入code,encryptedData,iv, 后台返回获得token

WXML

<view> <text>第3步：</text> <button type="primary" bindtap="login" size="mini">登录（我们自己的服务器）</button></view>

// 第3步：登录（我们自己的服务器） login() { let url = "/user/login"; let data = { code: this.data.code, encryptedData: this.data.encryptedData, iv: this.data.iv } App.$http.post(url, data, true).then(res => { console.log("登录", res); // 第4步，把后台返回的token存到本地缓存 try { wx.setStorageSync('token', res.user.token) } catch (e) { } }) },二、一键登录（三合一）

// 一键登录 login(event) { // 1、获取 encryptedData, ivlet { encryptedData, iv } = event.detail; // 微信登录 wx.login({ success: (res) => { // 2、获取code let code = res.code; // 3、登录后台服务器 let url = "/user/login"; let data = https://www.isolves.com/it/cxkf/ydd/xcx/2019-08-01/{ encryptedData, iv, code } app.$http.post(url, data, true).then(res => { console.log("登录成功", res); this.setData({ token: res.user.token }) // 4、把token存到本地缓存 try { wx.setStorageSync('token', res.user.token) } catch (e) { } }) } }) },三、授权
wx.authorize()

举个栗子

onLoad: function (options) { // 查看用户是否授权 wx.getSetting({ success(res) { console.log("录音授权", res.authSetting['scope.record']) let record = res.authSetting['scope.record']; if (!record) { wx.authorize({ scope: 'scope.record', success() { // 用户已经同意小程序使用录音功能，后续调用 wx.startRecord 接口不会弹窗询问 wx.startRecord() } }) } } }) },