手机扫码登录实现原理「建议收藏」

扫码登录原理最近接到一个需求,要求我用手机扫码实现用户登录,这是近几年比较流行的登录方式。这样确实是实现用户体验至上,操作简单,方便实用。拿到需求之后,我与后端大哥商量后,敲定了具体的实施方案。其实重要的还是要弄懂他实现的原理。需求:用户至上的体验效果,手机扫码同步登录状态很多企业在开发自己app的同时会推出网页版,为了登录更方便、更安全。企业会选用手机扫一扫,实现用户登录。神奇的是。为什么…

大家好,又见面了,我是你们的朋友全栈君。

最近接到一个需求,要求用手机扫码实现用户登录,这是近几年比较流行的登录方式。这样确实是实现用户体验至上,操作简单,方便实用。拿到需求之后,我与后端大哥商量后,敲定了具体的实施方案。其实重要的还是要弄懂他实现的原理。

需求:用户至上的体验效果,手机扫码同步登录状态

很多企业在开发自己app的同时会推出网页版,为了登录操作更方便、更安全。企业会选用手机扫一扫,实现用户登录。神奇的是。为什么网页只显示一个二维码就可以实现用户登录?这个二维码是固定的吗?怎么给用户分配的id?怎么能把手机上的登录信息同步到网页上?
例如:淘宝、京东这些,如何做到扫一扫授权就能登录成功,并实现用户信息同步的。

在这里插入图片描述
下面我们介绍一下手机扫码登录的实现原理,用到的服务器要有2台,手机端服务器和网页端服务器不是同一台服务器。

网页端与服务器

用户打开一个网站的登录页面==>此时浏览器会向服务器发送一个请求,这个请求用来获取登录的二维码==>服务器收到请求后,随机生成一个uuid,并将这个uuid作为key值存储在redis中,同时设置一个过期时间,过期后,用户的界面就会显示“需要重新获取二维码”。同时也将这个key值与本公司的验证字符串绑定在一起,然后将这些生成一个随机的二维码(网上有很多二维码生成器的接口和源码,可以直接调用)==>将二维码和用户的uuid一起返回给浏览器。

前端开发获取到这个这个二维码和uuid==>每隔一秒向浏览器发送一次登录是否成功的请求,请求中携带有uuid作为当前页面的标识符。

这里有一个问题:服务器只存了一个随机的uuid在redis中,那么用户的id的信息怎么会显示出来。其实这个用户的id信息是由手机服务器存在redis中的。这也就为什么要俩台服务器的原因。

手机端与服务器

刚刚我们说了,浏览拿到二维码并且展示在页面上。这个时候前端可以给定一个提示信息。请用手机扫一扫登录。用户拿到手机扫描二维码,就可以得到一个验证信息和一个uuid(扫描二维码获取字符串的这个案例网上也能找到很多),由于手机端已经进行过登录操作,后端也记录了用户信息,所以在访问手机端服务器的时候,参数中已经携带用户的token,手机端服务器就可以解析用户的uesrid(注意:这里从token中取值而不是手机端直接传userid是为了安全,直接传userid可能会被截获和修改,token是加密的,被修改的风险会小很多)。手机端将解析到的数据和用户token一起作为参数,向服务器发送验证登录请求(这里的服务器是手机服务器,手机端的服务器跟网页端服务器不是同一台服务器)。服务器收到请求后,首先对比参数中的验证信息,确定是否为用户登录请求接口。如果是,返回一个确认信息给手机端。

手机端收到返回后,将登录确认框显示给用户(防止用户误操作,同时使登录更加人性化)。用户在手机上确认是进行的登录操作后,手机再次发送请求。服务器拿到uuId和userId后,将用户的userid作为value值存入redis中以uuid作为key的键值对中。

登录成功

然后,浏览器再次发送请求的时候,浏览器端的服务器就可以得到一个用户Id,并调用登录的方法,生成一个浏览器端的token,然后浏览器再次发送请求的时候,将用户信息返回给浏览器,登录成功。这里存储用户id而不是直接存储用户信息是因为,手机端的用户信息,不一定是和浏览器端的用户信息完全一致。

在这里插入图片描述
如果你是前端小可爱,那么只需发送请求,接收消息就可以。重要的逻辑部分和解析工作还是由后端大佬们挑大梁,希望可以帮助到大家。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/125618.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • POJ 3982 序列 塔尔苏斯问题解决

    POJ 3982 序列 塔尔苏斯问题解决

    2022年1月8日
    47
  • pandas函数手册_函数str

    pandas函数手册_函数str一.假设有数据集dfdf.isnull()返回DateFrame,元素为空或者NA就显示True,否则就是False二.判断有空值的列df.isnull().any()当列有为空或者NA的元素,就为True,否则False三.显示出有空值列的列名的列表,iris.columns[iris.isnull().any()].tolist()四.删除全部是空值的行iris.dropna(axis=0,how=’all’,inplace=True)五。删除全部是空值的列iri

    2022年10月7日
    5
  • c++ 11 bind_箭头函数可以用bind吗

    c++ 11 bind_箭头函数可以用bind吗bind函数的使用详解可以将bind函数看作是一个通用的函数适配器,它接受一个可调用对象,生成一个新的可调用对象来“适应”原对象的参数列表。调用bind的一般形式:autonewCallable=bind(callable,arg_list);`其中,newCallable本身是一个可调用对象,arg_list是一个逗号分隔的参数列表,对应给定的callable的参数。即,当我们调用n……

    2025年7月8日
    6
  • 网络地址转换NAT原理及其作用「建议收藏」

    网络地址转换NAT原理及其作用「建议收藏」1 概述1.1 简介NAT英文全称是“Network Address Translation”,中文意思是“网络地址转换”,它是一个IETF(Interne

    2022年8月6日
    5
  • pycharm中pyqt5使用方法_pycharm安装pyqt5失败

    pycharm中pyqt5使用方法_pycharm安装pyqt5失败1.安装第pyqt5pipinstallpyqt52.QtDesigner安装和使用pipinstallpyqt5-tools3.UI文件转换成py文件$FileName$-o$FileNameWithoutExtension$.py-x4.将QRC资源文件转换成py文件$FileName$-o$FileNameWithoutExtension$_rc.py5.测试5.1新建项目5.2新建UI界面5.3将QT设计师保

    2022年8月29日
    2
  • SQL注入学习「建议收藏」

    SQL注入学习「建议收藏」SQL注入攻击指的是通过构建特殊的输入作为参数传入Web应用程序,而这些输入大都是SQL语法里的一些组合,通过执行SQL语句进而执行攻击者所要的操作,其主要原因是程序没有细致地过滤用户输入的数据,致使非法数据侵入系统。学习目的:能找到注入点能判断数据库是什么类型能绕过各种过滤SQL注入平台层注入原因:数据库平台漏洞或数据库配置不安全代码层注入原因:程序员对输入未进行细致地过滤,从而执行了非法的数据查询SQL注入漏洞的方法数字注入字符串注入SQL注入方法有很多种,按数据类型可以分为

    2022年8月20日
    10

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号