手机版

小程序的登录和授权

时间:2021-12-03 来源:互联网 编辑:宝哥软件园 浏览:

1.小程序登录

登录官方说明

小程序可以通过微信官方提供的登录能力轻松获取微信提供的用户ID,并在小程序中快速建立用户体系。

登录流程时序

小程序的登陆和授权(图1)

说明:

调用wx.login()获取临时登录证书代码,并将其发送回开发者服务器。调用代码2会话接口来交换唯一的用户标识OpenID和会话密钥session_key。之后,开发者服务器可以根据用户标识生成用户自定义的登录状态,用于在后续业务逻辑中前端和后端交互时标识用户标识。

注意:

会话密钥session_key是对用户数据进行加密和签名的密钥。为了应用自己的数据安全,开发者服务器不应该将会话密钥发送给小程序,也不应该将这个密钥提供给外界。临时登录证书代码只能使用一次,

兄弟们,是不是很简单,一看就会?我知道你们的回答如下图,但是不要慌,我们详细讲每一步

小程序的登陆和授权(图2)

小程序端执行wx.login后在回调函数中就能拿到上图的code,然后把这个code传给我们后端程序,后端拿到这个这个code后,可以请求code2Session接口拿到用的openid和session_key,openid是用户在微信中唯一标识,我们就可以把这个两个值(val)存起来,然后返回一个键(key)给小程序端,下次小程序请求我们后端的时候,带上这个key,我们就能找到这个val,就可以,这样就把登入做好了。

小程序的登陆和授权(图3)

1.1wx.login(Object object)

调用接口获取登录凭证(代码)。凭证交换用户的登录状态信息,包括用户的唯一标识(openid)和该登录的会话密钥(session_key)。用户数据的加密和解密通信依赖于会话密钥。更多信息,请参考小程序登录。

参数

Object object

属性类型的默认值必须指示最小版本时间超过无超时,单元ms1 . 9 . 90成功函数无接口调用回调函数失败函数无接口调用回调函数完成函数无接口调用回调函数结束(调用成功和失败将被执行)

object.success 回调函数

参数

属性类型的描述

r>codestring用户登录凭证(有效期五分钟)。开发者需要在开发者服务器后台调用code2Session,使用 code 换取 openid 和 session_key 等信息

示例代码

wx.login({  success(res) {    if (res.code) {      // 发起网络请求      wx.request({        url: 'https://test.com/onLogin',        data: {          code: res.code        },        success: function (res) {              wx.setStorageSync('login_key', res.data.data.login_key);        }      })    } else {      console.log('登录失败!' + res.errMsg)    }  }})

1.2code2Session

本接口应在服务器端调用,详细说明参见服务端API。

登录凭证校验。通过wx.login()接口获得临时登录凭证 code 后传到开发者服务器调用此接口完成登录流程。更多使用方法详见小程序登录。

请求地址

GET https://api.weixin.qq.com/sns/jscode2sessionappid=APPID&secret=SECRET&js_code=JSCODE&grant_type=authorization_code

请求参数

属性类型默认值必填说明appidstring是小程序 appIdsecretstring是小程序 appSecretjs_codestring是登录时获取的 codegrant_typestring是授权类型,此处只需填写 authorization_code

返回值

Object

返回的 JSON 数据包

属性类型说明openidstring用户唯一标识session_keystring会话密钥unionidstring用户在开放平台的唯一标识符,在满足 UnionID 下发条件的情况下会返回,详见UnionID 机制说明。errcodenumber错误码errmsgstring错误信息

errcode 的合法值

值说明-1系统繁忙,此时请开发者稍候再试0请求成功40029code 无效45011频率限制,每个用户每分钟100次

说完上面的登入后,我们是不是还没有用到上面的session_key?这个就是在用户授权的时候用的,用来解密用户的数据,还要解密?是的你没有听错,不要慌,下面给你解释

2.微信授权获取用户信

后端获取微信用户信息流程

小程序的登陆和授权(图4)

微信官方:忘了告诉你,session_key还会过期的,是的,没错就是这样坑爹。

我的回复:我就是头铁,我不管session_key过期,会带来什么样的后果呢?

微信官方:对不起,你头铁没有,你后端程序无法用户授权的数据,就问你气不气?

我的回复:好的,你牛逼,我可以接收你session_key过期,但是你要告诉我怎么判断他是过期的吧?怎么获取新的session_key吧?

微信官方:还是要按照我的要求来吧?看你这么可怜,告诉你吧,用wx.checkSession判断是否过期,如果过期就重写登入吧!获取新的code,后端在去请求code2Session获取新的session_key

我的回复:好的,谢谢你sb

小程序的登陆和授权(图5)

判断session_key有没有过期

2.1wx.checkSession(Object object)

检查登录态是否过期。

通过 wx.login 接口获得的用户登录态拥有一定的时效性。用户越久未使用小程序,用户登录态越有可能失效。反之如果用户一直在使用小程序,则用户登录态一直保持有效。具体时效逻辑由微信维护,对开发者透明。开发者只需要调用 wx.checkSession 接口检测当前用户登录态是否有效。

登录态过期后开发者可以再调用 wx.login 获取新的用户登录态。调用成功说明当前 session_key 未过期,调用失败说明 session_key 已过期。更多使用方法详见小程序登录。

参数

Object object

属性类型默认值必填说明successfunction否接口调用成功的回调函数failfunction否接口调用失败的回调函数completefunction否接口调用结束的回调函数(调用成功、失败都会执行)

示例代码

wx.checkSession({  success() {    // session_key 未过期,并且在本生命周期一直有效  },  fail() {    // session_key 已经失效,需要重新执行登录流程    wx.login() // 重新登录  }})

微信官方:你要获取用的信息?我告诉你哈,如果要获取的话,要经过用户同意的。

我的回复:sb,我怎么知道他是否授权过呢?如果没有授权,我怎么让他授权?

**微信官方:你好,你可以调用wx.getSetting来判断,用户是否授权,如果没有授权,你要让他点击按钮,调起授权页面。用户点击同意授权以后*,你就可以调用wx.getUserInfo接口获取数据了**

我的回复:妈的,怎么这么麻烦?

微信官方:对不起,大佬,没有办法啊,我们要保护用户的信息安全啊

我的回复:哦

小程序的登陆和授权(图6)

2.2wx.getSetting(Object object)

基础库 1.2.0 开始支持,低版本需做兼容处理。

获取用户的当前设置。返回值中只会出现小程序已经向用户请求过的权限。

参数

Object object

属性类型默认值必填说明successfunction否接口调用成功的回调函数failfunction否接口调用失败的回调函数completefunction否接口调用结束的回调函数(调用成功、失败都会执行)

object.success 回调函数

参数

Object res

属性类型说明authSettingAuthSetting用户授权结果

示例代码

wx.getSetting({  success(res) {    console.log(res.authSetting)    //部分结果,如果为true,则表示该用户对这项权限以及授权,如果没有授权,我们这需要通过button按钮让用户授权    // res.authSetting = {    //   "scope.userInfo": true,    //   "scope.userLocation": true    // }  }})

注意事项

  1. wx.authorize({scope: "scope.userInfo"}),不会弹出授权窗口,请使用<button_open-type="getUserInfo">
  2. 需要授权scope.userLocation时必须配置地理位置用途说明。

微信官方:当你小程序端调用我们wx.getUserInfo的时候,我们会返回你用的基本信息。

我的回复:什么是基本信息,哪些是敏感信息?我后端怎么获取呢?

微信官方:比如openid这些,大佬,你又两种方法,第一:你可以将这些基本信息传到后端,第二: 你可以讲getUserInfo中的 iv,encryptedData传给后端解密,机密后就能获取到用户的敏感信息了

我的回复:好的,我后端怎么解密呢?用什么解密呢?

微信官方:你登入的时候不是,后端不是存了session_key吗?加上这些数据,就可以解密了

我的回复:哦

2.3wx.getUserInfo(Object object)

获取用户信息

调用前需要用户授权scope.userInfo。

获取用户信息。

参数

Object object

属性类型默认值必填说明withCredentialsboolean否是否带上登录态信息。当 withCredentials 为 true 时,要求此前有调用过 wx.login 且登录态尚未过期,此时返回的数据会包含 encryptedData, iv 等敏感信息;当 withCredentials 为 false 时,不要求有登录态,返回的数据不包含 encryptedData, iv 等敏感信息。langstringen否显示用户信息的语言successfunction否接口调用成功的回调函数failfunction否接口调用失败的回调函数completefunction否接口调用结束的回调函数(调用成功、失败都会执行)

object.lang 的合法值

值说明en英文zh_CN简体中文zh_TW繁体中文

object.success 回调函数

参数

Object res

属性类型说明userInfoUserInfo用户信息对象,不包含 openid 等敏感信息rawDatastring不包括敏感信息的原始数据字符串,用于计算签名signaturestring使用 sha1( rawData + sessionkey ) 得到字符串,用于校验用户信息,详见用户数据的签名验证和加解密encryptedDatastring包括敏感数据在内的完整用户信息的加密数据,详见用户数据的签名验证和加解密ivstring加密算法的初始向量,详见用户数据的签名验证和加解密

接口调整说明

在用户未授权过的情况下调用此接口,将不再出现授权弹窗,会直接进入 fail 回调(详见《公告》)。在用户已授权的情况下调用此接口,可成功获取用户信息。

示例代码

// 必须是在用户已经授权的情况下调用wx.getUserInfo({  success(res) {    const userInfo = res.userInfo    const nickName = userInfo.nickName    const avatarUrl = userInfo.avatarUrl    const gender = userInfo.gender // 性别 0:未知、1:男、2:女    const province = userInfo.province    const city = userInfo.city    const country = userInfo.country  }})

encryptedData 解密后为以下 json 结构,详见加密数据解密算法

{  "openId": "OPENID",  "nickName": "NICKNAME",  "gender": GENDER,  "city": "CITY",  "province": "PROVINCE",  "country": "COUNTRY",  "avatarUrl": "AVATARURL",  "unionId": "UNIONID",  "watermark": {    "appid": "APPID",    "timestamp": TIMESTAMP  }}

示例代码

<!-- 如果只是展示用户头像昵称,可以使用 <open-data /> 组件 --><open-data type="userAvatarUrl"></open-data><open-data type="userNickName"></open-data><!-- 需要使用 button 来授权登录 --><button  wx:if="{{canIUse}}"  open-type="getUserInfo"  bindgetuserinfo="bindGetUserInfo">  授权登录</button><view wx:else>请升级微信版本</view>Page({  data: {    canIUse: wx.canIUse('button.open-type.getUserInfo')  },  onLoad() {    // 查看是否授权    wx.getSetting({      success(res) {        if (res.authSetting['scope.userInfo']) {          // 已经授权,可以直接调用 getUserInfo 获取头像昵称          wx.getUserInfo({            success(res) {              console.log(res.userInfo)               wx.request({                  url: url,                  data: {                    'iv': res.iv,                    'encryptedData': res.encryptedData,                    'login_key':登入标识                  },                  method: "POST",                  header: {                    'content-type': 'application/json' // 默认值                  },                  success: function (res) {                    //解密后数据                    console.log(res);                  }                });            }          })        }      }    })  },  bindGetUserInfo(e) {    console.log(e.detail.userInfo)  }})

叫你解密大法

小程序的登陆和授权(图7)

2.4开放数据校验与解密

小程序可以通过各种前端接口获取微信提供的开放数据。考虑到开发者服务器也需要获取这些开放数据,微信会对这些数据做签名和加密处理。开发者后台拿到开放数据后可以对数据进行校验签名和解密,来保证数据不被篡改。

小程序的登陆和授权(图8)

签名校验以及数据加解密涉及用户的会话密钥 session_key。 开发者应该事先通过wx.login登录流程获取会话密钥 session_key 并保存在服务器。为了数据不被篡改,开发者不应该把 session_key 传到小程序客户端等服务器外的环境。

数据签名校验

为了确保开放接口返回用户数据的安全性,微信会对明文数据进行签名。开发者可以根据业务需要对数据包进行签名校验,确保数据的完整性。

  1. 通过调用接口(如wx.getUserInfo)获取数据时,接口会同时返回 rawData、signature,其中 signature = sha1( rawData + session_key )
  2. 开发者将 signature、rawData 发送到开发者服务器进行校验。服务器利用用户对应的 session_key 使用相同的算法计算出签名 signature2 ,比对 signature 与 signature2 即可校验数据的完整性。

如 wx.getUserInfo的数据校验:

接口返回的rawData:

{  "nickName": "Band",  "gender": 1,  "language": "zh_CN",  "city": "Guangzhou",  "province": "Guangdong",  "country": "CN",  "avatarUrl": "http://wx.qlogo.cn/mmopen/vi_32/1vZvI39NWFQ9XM4LtQpFrQJ1xlgZxx3w7bQxKARol6503Iuswjjn6nIGBiaycAjAtpujxyzYsrztuuICqIM5ibXQ/0"}

用户的 session-key:

HyVFkGl5F5OQWJZZaNzBBg==

用于签名的字符串为:

{"nickName":"Band","gender":1,"language":"zh_CN","city":"Guangzhou","province":"Guangdong","country":"CN","avatarUrl":"http://wx.qlogo.cn/mmopen/vi_32/1vZvI39NWFQ9XM4LtQpFrQJ1xlgZxx3w7bQxKARol6503Iuswjjn6nIGBiaycAjAtpujxyzYsrztuuICqIM5ibXQ/0"}HyVFkGl5F5OQWJZZaNzBBg==

使用sha1得到的结果为

75e81ceda165f4ffa64f4068af58c64b8f54b88c

加密数据解密算法

接口如果涉及敏感数据(如wx.getUserInfo当中的 openId 和 unionId),接口的明文内容将不包含这些敏感数据。开发者如需要获取敏感数据,需要对接口返回的加密数据(encryptedData)进行对称解密。 解密算法如下:

  1. 对称解密使用的算法为 AES-128-CBC,数据采用PKCS#7填充。
  2. 对称解密的目标密文为 Base64_Decode(encryptedData)。
  3. 对称解密秘钥 aeskey = Base64_Decode(session_key), aeskey 是16字节。
  4. 对称解密算法初始向量 为Base64_Decode(iv),其中iv由数据接口返回。

微信官方提供了多种编程语言的示例代码(点击下载)。每种语言类型的接口名字均一致。调用方式可以参照示例。

另外,为了应用能校验数据的有效性,会在敏感数据加上数据水印( watermark )

watermark参数说明:

参数类型说明appidString敏感数据归属 appId,开发者可校验此参数与自身 appId 是否一致timestampInt敏感数据获取的时间戳, 开发者可以用于数据时效性校验

如接口wx.getUserInfo敏感数据当中的 watermark:

{  "openId": "OPENID",  "nickName": "NICKNAME",  "gender": GENDER,  "city": "CITY",  "province": "PROVINCE",  "country": "COUNTRY",  "avatarUrl": "AVATARURL",  "unionId": "UNIONID",  "watermark": {    "appid": "APPID",    "timestamp": TIMESTAMP  }}

注:

  1. 解密后得到的json数据根据需求可能会增加新的字段,旧字段不会改变和删减,开发者需要预留足够的空间

会话密钥 session_key 有效性

开发者如果遇到因为 session_key 不正确而校验签名失败或解密失败,请关注下面几个与 session_key 有关的注意事项。

  1. wx.login调用时,用户的 session_key可能会被更新而致使旧 session_key 失效(刷新机制存在最短周期,如果同一个用户短时间内多次调用wx.login,并非每次调用都导致 session_key 刷新)。开发者应该在明确需要重新登录时才调用wx.login,及时通过code2Session接口更新服务器存储的 session_key。
  2. 微信不会把 session_key 的有效期告知开发者。我们会根据用户使用小程序的行为对 session_key 进行续期。用户越频繁使用小程序,session_key 有效期越长。
  3. 开发者在 session_key 失效时,可以通过重新执行登录流程获取有效的 session_key。使用接口wx.checkSession可以校验 session_key 是否有效,从而避免小程序反复执行登录流程。
  4. 当开发者在实现自定义登录态时,可以考虑以 session_key 有效期作为自身登录态有效期,也可以实现自定义的时效性策略。

版权声明:小程序的登录和授权是由宝哥软件园云端程序自动收集整理而来。如果本文侵犯了你的权益,请联系本站底部QQ或者邮箱删除。