微信授权登录:从入门到精通

7 评论 11248 浏览 123 收藏 11 分钟

现在,市面上大多数应用都选择了接入微信授权登录这一快捷登录方式,那么,怎么拆解微信授权登录呢?这篇文章里,作者就介绍了微信授权登录的各种对接场景、以及授权登录设计等方面的内容,想了解的同学,就一起来看看吧。

微信授权登录是微信开放给第三方应用的快捷登录方式,因其用户体量大、对接简单、体验感好,市面上大多应用都已选择接入,本文将具体介绍微信授权登录的各种对接场景。

一、授权方式

目前微信授权的方式有3种:

1)常规授权。这种授权方式是最简单最快速的授权方式,发起授权时,微信直接打开授权页面,点击允许即可完成授权。

2)关注公众号授权。这种授权方式要求用户关注应用绑定的公众号进行授权,发起授权时,微信会打开对应公众号关注页,关注公众号即可完成授权。

3)手机号授权。这种授权方式目前只能在小程序中调用,发起授权时,小程序内弹出授权提示窗口,点击手机号即可完成授权。

(PS:自2023年8月26日起,手机号快速验证组件将需要付费使用。标准单价为:每次组件调用成功,收费0.03元。)

二、调用途径

微信授权调用途径目前有4种:

  1. 网页调用。在微信浏览器中发起授权,调出授权页面。
  2. 小程序调用。在小程序中发起授权,调出授权页面。
  3. 扫码调用。web 页面生成授权二维码,微信“扫一扫”扫码调出授权页面。
  4. App 跳转调用。在 App 中发起授权,跳转到微信并调出授权页面。

三、授权信息

目前通过微信授权能够获取到的授权信息大多是技术参数,产品经理主要需要关注以下几个重点的信息:

  1. 头像。
  2. 昵称(用户名,非真实姓名)。
  3. 性别。
  4. 国家。
  5. 地区(用户资料中填写的省份和市区)。
  6. 手机号(通过手机号授权方式才能获取到)。

四、授权技术原理

有一些产品经理害怕接入微信授权登录需要对现有产品的用户体系进行大改,所以有必要简单介绍一下微信授权的技术原理。

业务系统接入微信授权后,在授权发生时,业务系统会接到微信接口提供的用户身份码(openid),这是用户身份的唯一标识,业务系统只需要在首次授权时,将该身份码绑定到对应的用户上,下次授权再次发生时,如果该身份码已绑定账号,即可登录对应账号。

简单的授权登录流程:

结合上述技术原理,可以用流程图来画一个简单的授权登录流程。

以上流程只适用于只有微信授权登录一种登录方式的业务系统,目前的大多数产品都支持多种登录方式,实际场景要比这复杂得多。

五、复杂场景的授权登录设计

很多平台都是先做了常规的注册登录,之后才接入微信授权登录,所谓的“常规”指的是一般平台比较常用的账号密码登录或当下比较流行的手机验证码登录,平台之前可能已经有了一定用户量,所以在接入授权登录时,需要考虑旧用户的绑定问题。

如果平台原来是通过手机号进行用户注册,现在接入的也是微信的手机号授权,处理旧用户的流程会更简单。

这里虽然是通过手机号授权登录,但同样建议将获取到的 openid 绑定到对应的用户上,刚刚说过,目前手机号授权登录只能在小程序中使用,如果不绑定 openid,在其他端口进行授权时,就无法识别到已经授权成功的用户。

上面的流程有一个致命的问题不知道你发现没有,就是授权获取的手机号在平台中的账号如果已经绑定了另外一个微信用户的 openid,按照上述流程,当前微信用户通过手机号授权可以登录该账号,但如果通过其他授权方式登录,就登录不了了。

这个问题有两种优化方案,第一种简单粗暴,不做判断,只要验证通过就将当前微信用户的 openid 绑定上去。

第二种则温和一点,判断一下账号绑定的 openid 跟当前微信用户是否一致,不一致时提醒用户,交给用户选择。

需要注意,如果用户没有选择解除并绑定新的 openid,那么更换授权方式无法登录的问题依然存在。

上述提到的常规授权方式也可能产生类似问题,解决思路是一样的,这里就不再画图了,各位有兴趣可以自己动手改改。

六、用户不同意授权的解决方案

在询问授权时,用户有可能拒绝应用获取微信授权,因此产品经理在设计微信授权流程时,也需要考虑到这种情况的发生。

如果产品只能通过微信授权登录,这种情况发生时,完全没有办法解决,所以如果有可能的话,还是建议开发多种登录方式,在遇到用户不同意授权的情况时,系统自动切换到常规的登录方式。

如果你希望能够尽可能获取到用户的授权,可以采用“二次授权”的方式,如果首次获取授权被用户拒绝,用户通过常规方式登录成功后,可以判断登录的账号是否有绑定微信账号,如果没有,此时可以再调用一次授权,让用户再次确认,不过,这种方式对用户的体验不是很友好,请谨慎使用。

另外一种方式可以尝试下,有可能提升用户授权的成功率。由于授权页面都是微信提供的,微信只简单提示授权要获取用户的哪些信息,有些用户出于安全方面的考虑可能会习惯性拒绝授权,因此可以在调用授权之前,平台先弹出一个提示,告知用户接下来需要获取用户的微信授权,并同时说明,为什么要获取授权,会获取哪些信息,这些信息会用于什么地方,并承诺不会滥用和出售用户的信息等等。其主要目的是让用户了解接下来要发生的事情,并尽最大可能打消用户对授权的疑虑。

七、多平台产品的授权方式选择

有些产品规模比较大,几乎做到了“全端覆盖”,web 端、App、小程序、h5等,考虑到用户体验,不同的端口建议选择不同的授权方式。比如,web 端是通过扫码授权登录的,因此通过扫码关注公众号登录是完全没问题的。

但是在 h5 就不适用了,如果在 h5 发起关注公众号授权,微信会从原网页跳转到公众号关注页,关注后用户可能会点击进入公众号或通过文章列表进入其他页面,从而导致用户跳离了目标页面。

在小程序中,如果调用手机号授权被用户拒绝,可以退而求其次,改为普通授权,这种方式不会获取用户的手机号,用户的戒心相对没有那么重,更容易获得用户的同意。

至于 App 端,就比较灵活了,只要微信支持的,采用什么方式都行,因为在授权成功之后,都会返回到 App 主体。

以上便是本文的全部内容,感谢阅读,我正在参与《人人都是产品经理》年度最受欢迎作家评选,如果你觉得我的文章对你有用,烦请为我投上宝贵的一票,谢谢。

投票传送门:https://996.pm/MRxv6

专栏作家

产品锦李,公众号:产品锦李(ID:IMPM996),人人都是产品经理专栏作家。不务正业的产品经理和他的产品设计。

本文原创发布于人人都是产品经理,未经许可,禁止转载。

题图来自Unsplash,基于CC0协议。

该文观点仅代表作者本人,人人都是产品经理平台仅提供信息存储空间服务。

更多精彩内容,请关注人人都是产品经理微信公众号或下载App
评论
评论请登录
  1. 3、下面留言的问题,这个问题就不对,杀死小程序后不会要求重新授权登录。因为本地存了用户openID与手机号码的映射关系。出现重新授权的原因是因为用户的session实效了,需要通过wx.checkSession这个接口去校验

    来自湖南 回复
  2. 还是先看下微信的接口文档吧,
    1、用户进入小程序后,是由小程序端调用微信官方登录wx.login接口,再把登录凭证code回传只开发者服务端,由服务端调微信的接口auth.code2Session 接口,获取open_id、union_id,换句话说,获取用户的open_id、UID是不需要用户做手动授权的。
    2、要真按上面的流程设计,那用户每一次进入小程序都需要用户授权去获取用户的手机号码,uinID对你来说就是完全没有意义的东西,都没用到

    来自湖南 回复
  3. 大佬您好,新入行的,我想问问第一种登录方式(常规授权),是移动app可以接入么,然后他是收费的不。我在微信开放台看了下,写的我看着有点懵

    来自广西 回复
    1. 移动app可以使用常规授权,就是跳转到微信中,只需微信用户点击同意授权即可,据我所知这个目前是免费的

      来自广东 回复
  4. 您好,想请教您几个问题。①现在用户在小程序中只要微信授权了一次,后面就不再调用授权组件了吗?②如果是这样的话,那微信的收费岂不是随着新注册用户数量的减少而减少?③现实中为什么有的小程序后台杀死后,再次进入还需要再一次授权?

    来自浙江 回复
    1. ①授权有一定的有效期,过了有效期之后需要重新授权,目前官方文档没有明确给出这个有效期时间,据查不同场景不同授权方式的有效期不同。②收费是按调用成功收费的,因此每调用一次就收一次费,跟短信一样,每发一条收一次费。有的小程序为了节省这笔费用,会进行两次授权,先用常规授权方式获取微信用户的 openid,判断用户是否有手机号,如果没有才调用手机号授权,如果有,就不再调用,这样体验感会差一点,但可以有效减少重复授权的扣费。③这种应该是程序上没处理好,比如程序没有保存好用户的登录信息,导致杀后台后需要重新授权。

      来自广东 回复
    2. 非常感谢您的耐心指导~

      来自浙江 回复