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

二维码,大家再熟悉不过了

购物扫个码,吃饭扫个码,坐公交也扫个码

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

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

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

二维码登录的本质

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

  1. 告诉系统我是谁

  2. 向系统证明我是谁

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

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

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

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

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

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

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

认识二维码

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

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

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

在搜索引擎中搜索二维码,你可以找到很多在线生成二维码的工具网站,这些网站可以提供字符串与二维码之间相互转换的功能,比如 草料二维码网站[2]

在左边的输入框就可以输入你的内容,它可以是文本、网址,文件........。然后就可以生成代表它们的二维码

你也可以把二维码上传,进行”解码“,然后就可以解析出二维码代表的含义

系统认证机制

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

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

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

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

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

const token = {acountid:'账号ID',deviceid:'登录的设备ID',deviceType:'设备类型,如 iso,android,pc......',
}
复制代码

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

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

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

从前面这个流程,我们可以看到,客户端不会也没必要保存你的密码,相反,它是保存了 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 端不断的轮询服务端,比如每隔一秒就轮询一次,请求服务端告诉当前二维码的状态及相关信息

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

扫描状态切换

  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 等扫码登录,那么这种通过第三方应用扫码登录又是什么原理呢?

来源 | https://juejin.cn/post/6940976355097985032

文章有帮助的话,在看,转发吧。
谢谢支持哟 (*^__^*)

TikTok二面: 说下二维码登录的原理?相关推荐

  1. 手机扫描网页二维码登录实现原理分析

    阅读本文大概需要 5 分钟. 相信我们每个人经历过这样的场景: 手机扫码登录 PC 版微信,通过二维码扫描登录,笔记本上的微信就和手机微信同步登录了.这样免去输入繁琐的账号密码,确定方便得很. 对于这 ...

  2. 微信扫描二维码登录网页原理

    恰好我之前也花过几个小时做过类似的验证登录过程,这里作为探讨,把产品同学的回答做个引用,解释一下其中『不技术』的地方. 1. 每打开一次微信网页版页面的时候会随机生成一个含有唯一 uid 的二维码,每 ...

  3. 形象理解二维码登录原理

    之前在极客时间看到一个介绍二维码登录的原理,这里写篇文章记录一下.二维码是我们日常生活中随处可见,支付扫码,登录扫码,添加好友扫码,或者查看某些内容也需要扫码.今天分享一下二维码背后的技术和逻辑,并且 ...

  4. JAVA 实现扫码二维码登录

    最近在做一个扫码登录功能,为此我还在网上搜了一下关于微信的扫描登录的实现方式.当这个功能完成了后,我决定将整个实现思路整理出来,方便自己以后查看也方便其他有类似需求的程序猿些. 要实现扫码登录我们需要 ...

  5. C(++) Websocket实现扫码二维码登录---GoEasy

    最近在做一个扫码登录功能,为此我还在网上搜了一下关于微信的扫描登录的实现方式.当这个功能完成了后,我决定将整个实现思路整理出来,方便自己以后查看也方便其他有类似需求的程序猿些. 要实现扫码登录我们需要 ...

  6. node.js 实现扫码二维码登录

    最近在做一个扫码登录功能,为此我还在网上搜了一下关于微信的扫描登录的实现方式.当这个功能完成了后,我决定将整个实现思路整理出来,方便自己以后查看也方便其他有类似需求的程序猿些. 要实现扫码登录我们需要 ...

  7. 二维码登录原理及生成与解析

    一.前言 这几天在研究二维码的扫码登录.初来乍到,还有好多东西不懂.在网上看到有人写了一些通过QRCode或者Zxing实现二维码的生成和解码.一时兴起,决定自己亲手试一试.本人是通过QRCode实现 ...

  8. 深入理解微信二维码扫码登录的原理

    文章目录 1.二维码应用场景及安全问题 2.二维码登录的本质 3.二维码验证机制的原理解析 4.深入理解二维码在登录的交互过程 5.总结感悟 1.二维码应用场景及安全问题 二维码使用广泛,生活处处都有 ...

  9. 浅谈扫描二维码登录微信网页版与摇一摇传图的实现原理

    前言:简单体验了下微信网页版通过二维码登录和摇一摇传图功能,从技术角度看,网上专家吹捧的 [隔空取物]其实并不神秘,我先简单分析一下. 1. 微信移动端扫描二维码登录(C-S-C模式) CSC模式为: ...

  10. 微信QQ的二维码登录原理浅析

    在非常多地方就是都出现了使用二维码登录,二维码付款,二维码账户等应用(这里的二维码种马,诈骗就不说了),二维码验证,多终端辅助授权应用開始多起来,这里先说下啥是二维码,事实上二维码就是存了二进制数据的 ...

最新文章

  1. TeamViewer介绍:远程控制计算机
  2. python3 字符串 hex 相互转换 代替python2 decode(‘hex’)
  3. python datasets_python基础之sklearn.datasets
  4. jsp中setAttribute与getAttribute方法使用介绍
  5. [platform]linux platform device/driver(三)--Platform Device和Platform_driver注册过程之代码对比...
  6. 如何让context attribute不出现在configuration界面的available fields列表内
  7. C语言实用算法系列之memcpy、memmove函数原理与实现
  8. jQuery学习笔记——筛选元素集合
  9. input美化上传按钮美化
  10. 服务器BIOS、BMC、IPMI、EFI、UEFI等知识详解
  11. 利用简单电阻分压原理自动测量电阻
  12. HTML转PDF问题
  13. php九九乘法表带表格,九九乘法表打印(js打印九九乘法表用表格显示)
  14. Window安装Netbeans9
  15. 随笔—醒悟篇之考研调剂
  16. Xshell键盘数字键不能用怎么办?
  17. Ardunio开发实例-简单声音感应控制开关
  18. 将文件目录生成文档目录或者excel目录
  19. linux locale字符集设置,Linux下通过locale来设置字符集
  20. 英文版oracle数据库不能复制粘贴,win10 plsql没法复制 粘贴

热门文章

  1. 最新易支付多功能系统源码+全开源
  2. 360站长工具-免费360链接提交主动推送收录工具自带收录排名蜘蛛查询
  3. 开关稳压集成电路电源
  4. c语言编程中crol,单片机C语言“_crol_” 与“_cror_”的用法
  5. 三方协议、报到证(派遣证)、干部身份
  6. 系统提速,Windows Ready Boost,使用闪存设备提高性能
  7. android手机微信收藏功能实现,微信小程序收藏功能的实现代码
  8. 33. Pandas计算同比环比指标的3种方法
  9. Pandas计算同比环比指标的3种方法
  10. 计算机专业核心期刊好发吗,计算机核心期刊容易发吗