搜索
首页微信小程序小程序开发微信小程序授权登录流程时序 - 图文详解

微信小程序授权登录流程时序 - 图文详解

Jul 25, 2018 am 11:37 AM
javascript微信微信小程序

最近在做一个微信小程序开发的项目。场景布置:同一微信开放平台下拥有相同主体的APP和微信小程序来完成同样的业务,用户进入app或者微信小程序时必须获取用户的unionid来确认当前的用户身份,完成登录。小程序“获取用户信息”api(getUserInfo)的调用方式和之前相比有了较大更新,优雅的实现用户授权和登录非常重要,以下是我在微信小程序授权登录相关流程在开发时候的实现思路和总结,分享如下。

一、微信小程序登录流程时序

2701247478-5ac9b940ebede_articlex.jpg

说明:

  1. 小程序调用wx.login() 获取 临时登录凭证code ,并回传到开发者服务器

  2. 开发者服务器以code换取 用户唯一标识openid 和 会话密钥session_key。

  3. 临时登录凭证code只能使用一次

什么是openid?

在关注者与公众号产生消息交互后,公众号可获得关注者的OpenID(加密后的微信号,每个用户对每个公众号的OpenID是唯一的。对于不同公众号,同一用户的openid不同)。——微信公众平台开发者文档
  • 普通用户的标识,对当前公众号唯一

  • 不同的公众号,同一个用户,openid不同

你可以简单的理解为

openid = hash(uid + app_id)

什么是unionid?

如果开发者拥有多个移动应用、网站应用、和公众帐号(包括小程序),可通过unionid来区分用户的唯一性,因为只要是同一个微信开放平台帐号下的移动应用、网站应用和公众帐号(包括小程序),用户的unionid是唯一的。换句话说,同一用户,对同一个微信开放平台下的不同应用,unionid是相同的。UnionID机制说明

如果开发者在多个移动应用、网站应用和公众帐号之间有统一用户账号的需求,需要前往微信开放平台(open.weixin.qq.com)绑定公众号后,便可利用UnionID机制来满足上述需求。

  • 一个微信开放平台帐号下可以有多个移动应用,网站应用,公众账号和小程序

  • 只要是同一个微信开放平台帐号下的移动应用、网站应用和公众帐号(包括小程序),用户的unionid是唯一的。

用户在开放平台的唯一标识符

你可以简单的理解为:

unionid = hash(uid + 开放平台id)

总结下
微信针对不同的用户在不同的应用下都有唯一的一个openId, 但是要想确定用户是不是同一个用户,就需要靠unionid来区分。一般自己的后台都会有自己的一个用户表,每个用户有不同的userid。也就是说同一个用户在同一个微信开放平台下的相同主体的应用对应着相同的userid,unionid以及不同的openid。所以在用户登录进来的时候,我们只能靠微信返回给我们的unionid去判断是不是同一个用户,在去关联我们的用户表,拿到对应的userid。

二、微信小程序如何获取unionid?

绑定了开发者帐号的小程序,可以通过下面3种途径获取UnionID。

  1. 调用接口wx.getUserInfo,从解密数据中获取UnionID。注意本接口需要用户授权,请开发者妥善处理用户拒绝授权后的情况。

  2. 如果开发者帐号下存在同主体的公众号,并且该用户已经关注了该公众号。开发者可以直接通过wx.login获取到该用户UnionID,无须用户再次授权。

  3. 如果开发者帐号下存在同主体的公众号或移动应用,并且该用户已经授权登录过该公众号或移动应用。开发者也可以直接通过wx.login获取到该用户UnionID,无须用户再次授权。

2909503880-5b5494fa6d1b3_articlex.jpg

当用户满足条件2和3时,开发者可以直接通过wx.login获取到该用户的unionid, 否则必须调用接口wx.getUserInfo,额外需要注意的事就是妥善处理用户拒绝授权的情况。

三、登录最佳实践

  1. 调用 wx.login 获取 code。

  2. 使用 wx.getSetting 获取用户的授权情况

  • 如果用户已经授权,直接调用 API wx.getUserInfo 获取用户最新的信息;

  • 用户未授权,在界面中显示一个按钮提示用户登入,当用户点击并授权后就获取到用户的最新信息。

  • 将获取到的用户数据连同wx.login返回的code一同传给后端

  • 395100902-5b5494fa55578_articlex.jpg

    封装ajax()

    在真实的业务场景中,我们希望,用户进入小程序时,未登录情况下可以正常浏览商品,对小程序有个基本的认知,不要直接弹出框要求用户授权,否则会干扰用户,导致新用户的流失,当用户需要使用一些高级功能和场景,这个时候再去要求用户授权,这样用户授权的几率会大大提高。
    将登录的逻辑封装ajax
    流程:
    895901450-5b5494fa5ea2e_articlex.jpg

    封装的意义
    不再关注当前接口是否需要登录,用户是否已授权,所有请求直接调用ajax(),在必要的时候完成一切登录以及授权流程。小程序入口页面增加,业务拓展的时候,你只需要专注于业务实现。

    参考资料

    • 小程序•小故事(4)——获取用户信息

    • 获取用户基本信息(UnionID机制)

    • UnionID机制说明

    相关推荐:

    微信小程序开发文档

    微信小程序开发实战视频教程

    开发微信小程序视频教程

    以上是微信小程序授权登录流程时序 - 图文详解的详细内容。更多信息请关注PHP中文网其他相关文章!

    声明
    本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

    热AI工具

    Undresser.AI Undress

    Undresser.AI Undress

    人工智能驱动的应用程序,用于创建逼真的裸体照片

    AI Clothes Remover

    AI Clothes Remover

    用于从照片中去除衣服的在线人工智能工具。

    Undress AI Tool

    Undress AI Tool

    免费脱衣服图片

    Clothoff.io

    Clothoff.io

    AI脱衣机

    AI Hentai Generator

    AI Hentai Generator

    免费生成ai无尽的。

    热门文章

    R.E.P.O.能量晶体解释及其做什么(黄色晶体)
    1 个月前By尊渡假赌尊渡假赌尊渡假赌
    R.E.P.O.最佳图形设置
    1 个月前By尊渡假赌尊渡假赌尊渡假赌
    威尔R.E.P.O.有交叉游戏吗?
    1 个月前By尊渡假赌尊渡假赌尊渡假赌

    热工具

    MinGW - 适用于 Windows 的极简 GNU

    MinGW - 适用于 Windows 的极简 GNU

    这个项目正在迁移到osdn.net/projects/mingw的过程中,你可以继续在那里关注我们。MinGW:GNU编译器集合(GCC)的本地Windows移植版本,可自由分发的导入库和用于构建本地Windows应用程序的头文件;包括对MSVC运行时的扩展,以支持C99功能。MinGW的所有软件都可以在64位Windows平台上运行。

    Dreamweaver CS6

    Dreamweaver CS6

    视觉化网页开发工具

    WebStorm Mac版

    WebStorm Mac版

    好用的JavaScript开发工具

    ZendStudio 13.5.1 Mac

    ZendStudio 13.5.1 Mac

    功能强大的PHP集成开发环境

    记事本++7.3.1

    记事本++7.3.1

    好用且免费的代码编辑器