二维码扫码登陆

在日常生活中,二维码出现在很多场景,比如超市支付、系统登陆、应用下载等。了解二维码的原理,可以为技术人员在技术选型时候提供新的思路。对于非技术人员呢,除了解惑外,还可以引导他更好的辨别生活中的各种二维码,防止上当受骗。

在扫码的过程中,大家可能会有疑问:这个二维码安全吗?会不会泄漏我的个人信息呢?更深度的用户还会考虑,“我的系统是不是也可以搞一个二维码来推广呢?”

这时候就需要了解一下二维码背后的技术和逻辑了!

二维码最常用的场景之一就是通过手机端应用扫描PC或者WEB端的二维码,来登陆同一个系统。比如手机微信扫码登陆PC端微信,手机淘宝扫码登陆PC端淘宝。那么就让我们来看一下,二维码登陆是怎么操作的!

二维码登陆的本质

二维码登陆本质上也是一种登陆认证方式。既然是登陆认证,要做的也就两件事情!

1、告诉系统我是谁

2、向系统证明我是谁

比如账号密码登陆,账号就是告诉系统我是谁,密码就是向系统证明我是谁;比如手机验证码登陆,手机号就是告诉系统我是谁,验证码就是向系统证明我是谁;

那么扫码登陆是怎么做到这两件事情的呢?我们一起来考虑一下

手机端应用扫描PC端二维码,手机端确认后,账号就在PC端登陆成功了!这里,PC端登陆的账号肯定与手机是同一个账号。不可能手机端登陆的是账号A,而扫码登陆以后,PC端登陆的是账号B。

所以,第一件事情,告诉系统我是谁,是比较清楚的!

通过扫描二维码,把手机端的账号信息传递到PC端,至于是怎么传送的,我们后面再说

第二件事情,向系统证明我是谁。扫码登陆过程中,用户并没有去输入密码,也没有输入验证码,或者其他什么码。那是怎么证明我是谁的呢?

有些童鞋会想到,是不是扫码过程中,把密码传到了PC端呢?但这是不可能的。因为那样太不安全了,客户端也根本不会去存储密码。我们仔细想一下,其实手机端APP它是已经登陆过的,就是说手机端是已经通过登陆认证。所以说只要扫码确认是这个手机并且是这个账号操作的,其实就能间接证明我是谁。

认识二维码

那么如何做确认呢?我们后面会详细说明,在这之前我们需要先认识一下二维码!在认识二维码之前,我们先看下一维码!

所谓一维码,也就是条形码,超市里的条形码--这个大家非常熟悉,条形码实际上就是一串数字,它上面存储了商品的序列号。

二维码其实与条形码类似,只不过它存储的不一定是数字,还可以是任何的字符串,你可以认为,它就是字符串的另外一种表现形式。

二维码的“加密”、“解密”, 参考于草料二维码工具

系统认证机制

认识了二维码,我们了解一下移动互联网下的系统认证机制。

前面我们说过,为了安全,手机端它是不会存储你的登录密码的。但是在日常使用过程中,我们应该会注意到,只有在你的应用下载下来后,第一次登陆的时候,才需要进行一个账号密码的登陆,那之后呢,即使这个应用进程被杀掉,或者手机重启,都是不需要再次输入账号密码的,它可以自动登陆。

其实这背后就是一套基于token的认证机制,我们来看一下这套机制是怎么运行的,

1、账号、密码登陆时候,客户端会将设备信息一起传递给服务端;

2、如果账号、密码校验通过,服务端会把账号与设备鸡进行一个绑定,存在一个数据结构中,这个数据结构中包含了账号ID、设备ID、设备类型等信息

let token = {
    "account": "账号ID",
    "deviceId": "登陆的设备ID",
    "deviceType": "设备类型,如: IOS, Android, PC"
}

然后服务端会生成一个token,用它来映射数据结构,这个token其实就是一串有特殊意义的字符串,它的意义就在于,通过它可以找到对应的账号与设备信息,

1、客户端得到这个token后,需要进行一个本地保存,每次访问系统API都携带上token与设备信息。

2、服务端就可以通过token找到与它绑定的账号与设备信息,然后把绑定的设备信息与客户端每次传来的设备信息进行比较,如果相同,那么校验通过,返回API接口响应数据,如果不同,那就是校验不通过拒绝访问

从前面这个流程中我们可以看到,客户端不会也没有必要保存你得密码,相反,它是保存了token。可能又有些童鞋会想,这个token如此的重要,万一被别人知道了怎么办。实际上,知道了也没有影响,因为设备信息是唯一的,只要你的设备信息别人不知道,别人拿其他设备来访问,验证也是不通过的。

可以说,客户端登陆的目的,就是获得属于自己的token。

那么在扫码登陆过程中,PC端是怎么获得属于自己的token呢?不可能手机端直接把自己的token给PC端用!token只能属于某个客户端私有,其他人或者其他客户端是用不了的。在分析这个问题之前,我们有必要先梳理下,扫描二维码登陆的一般步骤是什么样的。这可以帮助我们梳理清楚整个过程。

扫描二维码登陆的一般步骤

1、扫描二维码之前,手机端应用是已经登陆的状态,PC端显示一个二维码,等待被扫描

2、手机端打开应用,扫描PC端的二维码,扫描后,会提示“已扫描,请在手机端点击确认”

3、用户在手机端点击确认,确认后PC端登陆就成功了

可以看到,二维码在中间有三个状态,待扫描、已扫描待确认、已确认。那么可以想象

1、二维码的背后它一定存在一个唯一性的ID,当二维码生成时,这个ID也一起生成,并且绑定了PC端的设备信息

2、手机去扫描这个二维码

3、二维码切换为已扫描待确认的状态,此时就会将账号信息与这个ID绑定

4、当手机端确认登陆时候,它就会生成PC端用于登陆的token,并返回给PC端

好了,到这里,基本思路就已经清晰了,接下来我们把整个过程再具体化一下

二维码准备

按二维码不同状态来看,首先是等待扫描状态,用户打开PC端,切换到二维码登陆界面时候。

1、PC端向服务端发起请求,告诉服务端,我要生成用户登陆的二维码,并且把PC端设备信息也传递给服务端

2、服务端收到请求后,它生成二维码ID,并将二维码ID与PC端设备信息及进行绑定

3、然后把二维码ID返回给PC端

4、PC端收到二维码ID后,生成二维码(二维码中肯定包含了ID)

5、为了及时知道二维码的状态,客户端在展现二维码后,PC端不断的轮询服务端,比如每隔一秒就轮询一次,请求服务端告诉当前二维码的状态及相关信息

备注:淘宝的有效二维码为3mins,失效后提示刷新二维码

二维码已经准备好了,接下来就是扫描状态

扫描状态切换

1、用户用手机去扫描PC端的二维码,通过二维码内容取到其中的二维码ID

2、再调用服务端API将移动端的身份信息与二维码ID一起发送给服务端

3、服务端接受到后,它可以将身份信息与二维码ID进行绑定,生成临时token,然后返回给手机端

4、因为PC端一直在轮询二维码状态,所以这时候二维码状态发生了改变,它就可以在界面上把二维码状态更新为已扫描

那么为什么需要返回给手机端一个临时token呢?临时token与token一样,它也是一种身份凭证,不同的地方在于它只能用一次,用过就失效。

在第三步骤中返回临时token,为的就是手机端在下一步操作时,可以用它作为凭证。以此确保扫码,登陆两步操作都是同一部手机端发出的。

状态确认

最后就是状态的确认了。

1、手机端在接收到临时token后,会弹出确认登陆界面,用户点击确认的时候,手机端携带临时token用来调用服务端的接口,告诉服务端,我已经确认

2、服务端收到确认后,根据二维码ID绑定的设备信息与账号信息,生成用户PC端登陆的token

3、这时候PC端的轮询接口,它就可以得知二维码的状态已经变成了“已确认”。并且从服务端可以获取到用户登陆的token

4、到这里,登陆就成功了,PC端就可以用token去访问服务端的资源了

扫码动作的基本流程都讲完了,有些细节还没有深入介绍,

比如二维码的内容是什么?

  • 可以是二维码ID
  • 可以是包含二维码ID的一个url地址

在扫码确认这一步,用户取消了怎么处理,这些细节欢迎大家踊跃参与讨论

总结

我们从登陆的本质出发,探索二维码扫码登陆是如何做到的

1、告诉系统我是谁

2、向系统证明我是谁

在这个过程中,我们先简单讲了两个前提知识,

一个是二维码的原理

一个是基于token的认证机制

然后我们通过以二维码状态为轴,分析了这背后的逻辑,通过token认证机制与二维码状态变换来实现扫码登陆。

需要指出的是,前面讲的是登陆系统,它适用于同一个系统的PC端,WEB端,移动端。

平时我们还有另外一种场景也比较常见,那就是通过第三方应用来扫码登陆,比如极客时间/掘金/都可以 选择微信/QQ/新浪等扫码登陆,那么这种通过第三方应用扫码登陆又是什么原理呢?

未完,期待下期

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 3
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值