小程序:授权、登录、session_key、unionId的详解


Posted in Javascript onMay 15, 2019

微信应用的一个很大的优势就在于使用过程中是不需要进行注册和显式登录的,大部分问题基本上可以一键解决。但是在授权、登录和获取用户信息的过程中都发生了哪些事情,今天我们就来讨论一下。这篇文章主要分析以下几个问题:

  1. 授权和登录的意义
  2. session_key 的作用
  3. unionId 的作用,有哪些获取途径
  4. 在应用中如何保存用户登录态

1. 授权和登录的意义

首先必须要明白,授权和登录实际上是两个操作。

1.1 授权(已废弃)

那授权的作用是啥呢?从小程序官方文档中我们可以看到授权操作只需通过wx.authorize() 接口便可以完成,以下是文档中对授权操作的描述:

提前向用户发起授权请求。调用后会立刻弹窗询问用户是否同意授权小程序使用某项功能或获取用户的某些数据,但不会实际调用对应接口。如果用户之前已经同意授权,则不会出现弹窗,直接返回成功。

也就是说,授权过程实际上只是在小程序前端获得了操作部分wx 接口的访问许可,这个过程实际上是不会与开发者服务器发生任何关系的。那这些访问许可包含哪些内容呢?再来看微信官方提供的scope 列表:

小程序:授权、登录、session_key、unionId的详解

注:新版api已废弃wx.authorize(),具体信息查看https://developers.weixin.qq.com/miniprogram/dev/api/open.html

1.2 登录

所谓的登录就是要让开发者服务器知道当前的用户是谁?在传统的web 应用中,我们必须要让用户输入账号和密码才能实现登录操作。但是在微信应用中,我们可以通过微信服务器来完成这个操作,获取到与当前用户对应的唯一标志(openId),具体操作实现流程如下:

注:每个用户相对于每个微信应用(公众号或者小程序)的openId 是唯一的,也就是说一个用户相对于不同的微信应用会存在不同的openId

小程序:授权、登录、session_key、unionId的详解

从上图中,我们可以看出,小程序中登录步骤如下:

① 小程序前端使用wx.login() 从微信服务器获取code

② 小程序前端将code 发送给开发者服务器,开发者服务器利用appId、appSecret 和code 向微信服务器换换取用户openId 和session_key

③ 开发者服务器自定义登录态并将其与openId 和session_key 关联起来然后写session

④ 开发者服务器将登录态返回给小程序前端,小程序前端使用wx.setStorageSync() 将登录态保存起来

⑤ 小程序前端在执行业务请求时将登录态发送给开发者服务器,以便开发者服务器知道当前操作的用户是哪位。

也就是说,在整个过程中小程序前端是拿不到用户openId 的,它只能通过开发者服务器发给它的登录态来告诉服务器当前用户的信息。登录过程中涉及session_key 和unionId,于是又引出了下面的问题。

2. session_key 的作用

那么,session_key 在登录的过程中或者登录完成后起什么作用呢?一起来看一下。

2.1 wx.getUserInfo

首先来看一下wx.getUserInfo 这个api:

小程序:授权、登录、session_key、unionId的详解

在设置withCredentials 属性为true 的情况下,这个api 可以拿到encryptedData,iv 等敏感信息,encryptedData 需要使用session_key 进行解密,解密后可以拿到的数据如下:

小程序:授权、登录、session_key、unionId的详解

也就是说,session_key 的作用之一是将小程序前端从微信服务器获取到的encryptedData 解密出来,获取到openId 和unionId 等信息。但是在1.2 登录过程中我们可以看到开发者服务器是能够直接拿到用户的openId 信息的,而且unionId 也是有其他获取途径的,所以session_key 在这里的作用看起来有点鸡肋。

2.2 getPhoneNumber

session_key 更重要的作用大概体现在获取用户手机方面(可能还包含其他敏感信息获取api)。

小程序:授权、登录、session_key、unionId的详解

从文档中可以看到getPhoneNumber 返回的用户数据是加密过的,只有使用session_key 才能解密,而小程序前端没有session_key,所以无法获取到用户的手机,只能传到开发者服务器进行处理。

3. unionId 的作用,有哪些获取途径?

关于unionId 的作用,可以参考Ref 中的连接。简单来说,就是同一用户针对同意微信公众平台下绑定的所有应用都具有相同的unionId。

获取途径有三种,在官方文档中写的比较清楚:

小程序:授权、登录、session_key、unionId的详解

4. 在应用中如何保存用户登录态

保存用户登录态,一直以来都有两种解决方案:前端保存和后端保存。

4.1 后端保存

在1.2 步骤③ 中写session 的时候可以直接设定过期时间,定期通知小程序前端重新进行登录(wx.login)。

4.2 前端保存

因为session_key 存在时效性问题(毕竟是用来查看敏感信息),而小程序前端可以通过wx.checkSession() 来检查session_key 是否过期。所以可以通过这个来作为保存用户登录态的机制,这也是小程序文档中推荐的方法:

小程序:授权、登录、session_key、unionId的详解

Ref: 微信小程序 获取session_key和openid

Ref: 微信UnionID作用

Ref: 小程序官方文档

以上所述是小编给大家介绍的小程序:授权、登录、session_key、unionId的详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
Jquery Ajax学习实例7 Ajax所有过程事件分析示例
Mar 23 Javascript
js监听鼠标点击和键盘点击事件并自动跳转页面
Sep 24 Javascript
jQuery中:first选择器用法实例
Dec 30 Javascript
Angular中的Promise对象($q介绍)
Mar 03 Javascript
jquery实现简单合拢与展开网页面板的方法
Sep 01 Javascript
微信小程序 省市区选择器实例详解(附源码下载)
Jan 05 Javascript
Bootstrap模态框使用详解
Feb 15 Javascript
Vue组件选项props实例详解
Aug 18 Javascript
原生JS实现旋转轮播图+文字内容切换效果【附源码】
Sep 29 Javascript
基于webpack4.X从零搭建React脚手架的方法步骤
Dec 23 Javascript
详解nginx配置vue h5 history去除#号
Nov 09 Javascript
详解vue3中组件的非兼容变更
Mar 03 Vue.js
javascript+HTML5 canvas绘制时钟功能示例
May 15 #Javascript
详解小程序用户登录状态检查与更新实例
May 15 #Javascript
基于vue如何发布一个npm包的方法步骤
May 15 #Javascript
浅谈 Webpack 如何处理图片(开发、打包、优化)
May 15 #Javascript
JavaScript页面倒计时功能完整示例
May 15 #Javascript
vue组件间通信六种方式(总结篇)
May 15 #Javascript
JS正则表达式封装与使用操作示例
May 15 #Javascript
You might like
PHP漏洞全解(详细介绍)
2012/11/13 PHP
php使用正则表达式进行字符串搜索的方法
2015/03/23 PHP
PHP中strncmp()函数比较两个字符串前2个字符是否相等的方法
2016/01/07 PHP
PHP获取网页所有连接的方法(附demo源码下载)
2016/03/30 PHP
getJSON调用后台json数据时函数被调用两次的原因猜想
2013/09/29 Javascript
js+jquery实现图片裁剪功能
2015/01/02 Javascript
ajax如何实现页面局部跳转与结果返回
2015/08/24 Javascript
jQuery实现返回顶部功能
2016/02/23 Javascript
JS函数定义方式的区别介绍
2016/03/22 Javascript
jQuery中on绑定事件后引发的事件冒泡问题如何解决
2016/05/25 Javascript
JS实现的跨浏览器解析XML文件实例
2016/06/21 Javascript
AngularJS实用开发技巧(推荐)
2016/07/13 Javascript
一个极为简单的requirejs实现方法
2016/10/20 Javascript
教你用十行node.js代码读取docx的文本
2017/03/08 Javascript
Angular.js基础学习之初始化
2017/03/10 Javascript
Webpack 之 babel-loader文件预处理器详解
2018/03/23 Javascript
JavaScript实现短暂提示框功能
2018/04/04 Javascript
Python中函数参数设置及使用的学习笔记
2016/05/03 Python
Python2.7编程中SQLite3基本操作方法示例
2017/08/09 Python
Python通过属性手段实现只允许调用一次的示例讲解
2018/04/21 Python
在dataframe两列日期相减并且得到具体的月数实例
2018/07/03 Python
对python 多个分隔符split 的实例详解
2018/12/20 Python
python时间序列数据转为timestamp格式的方法
2020/08/03 Python
Scrapy实现模拟登录的示例代码
2021/02/21 Python
保时捷设计:Porsche Design
2019/03/30 全球购物
教育专业个人求职信
2013/12/02 职场文书
电子商务应届生自我鉴定
2014/01/13 职场文书
《童年的发现》教学反思
2014/02/14 职场文书
暑期研修感言
2014/02/17 职场文书
医德医风演讲稿
2014/05/20 职场文书
党的群众路线教育实践活动方案
2014/10/31 职场文书
写作技巧:如何撰写一份优秀的营销策划书
2019/08/13 职场文书
导游词之南京莫愁湖公园
2019/11/13 职场文书
原生JS封装vue Tab切换效果
2021/04/28 Vue.js
MySQL索引知识的一些小妙招总结
2021/05/10 MySQL
vue使用localStorage持久性存储实现评论列表
2022/04/14 Vue.js