微信扫码登录的技术实现思考

简介: 微信扫码登录是很常见的技术,曾经在一次面试当中,面试官就曾问过微信扫码登录的实现思路,这次,以微信读书网页版扫码登录为例子,聊聊我对它技术实现思路一些思考。

微信扫码登录是很常见的技术,曾经在一次面试当中,面试官就曾问过微信扫码登录的实现思路,这次,以微信读书网页版扫码登录为例子,聊聊我对它技术实现思路一些思考。

以谷歌浏览器来做分析,打开F12,准备随时观察http连接状况。

可以看到,在二维码弹出来的时候,前端调用了后端两个接口,一个是getuid(),一个是getinfo(),这里面涉及到哪些逻辑实现呢?

微信扫码登录的技术实现思考

稍微思考一下,其实很好理解,每个随机生成的二维码,其实都是一个uuid码,也就是说,在点击登录的时候,会执行一个getuid()方法,该方法调用后端API:web/login/getuid会返回一个随机生成的uuid码,当这个uuid码返回到前端上时,就以二维码的形式展示。

点击getuid(),可看到该方法返回一个随机生成的uuid:38e673a9-5bd3-4f0c-ba2f-62ab376372a9

微信扫码登录的技术实现思考

与此同时,还调用了另一个getinfo()方法,这应该是getuid调用成功后的回调方法,也就是当getuid()执行成功后,得到一个uid时,就立马调用getinfo()方法,同时将生成的uid当做参数传给getinfo(),让其去访问后端API。

微信扫码登录的技术实现思考

当没有用手机微信进行扫码操作时,会看到getinfo()一直没有返回值,可见,它一直在做轮询操作,在某段时间内,若没有轮询成功,就会断开连接,接口调用失败。

微信扫码登录的技术实现思考

到这里,可以简单归纳下生成二维码流程,即,在点击登录时,会调用getuid()方法调用后端API接口“web/login/getuid”,将随机返回一个唯一uid,这时会将参数传给回调方法getinfo({“uid”:”38e673a9-5bd3-4f0c-ba2f-62ab376372a9″}),该方法会将uid参数传给后端API接口“web/login/getinfo”,这时,将一直做轮询将uid去redis查询,若能查询成功,即登录成功,反之,连接超时失败。

下面用两段伪代码来说明下大概代码逻辑:

一.前端React.js获取uuid并回调给getinfo()伪代码:

export const getuid=(params={},queue='getuid')=>dispatch=>{
       http.post({
           url:'https://weread.qq.com/web/login/getuid',
           params:params,
           queue:queue,
           callback:(res)=>{
               //getuid方法执行成功,返回{uid: "38e673a9-5bd3-4f0c-ba2f-62ab376372a9"},回调getinfo()
               dispatch(getinfo({uid:res.uid}))
           }
      });
  }
  
  export const getinfo=(params={},queue='getinfo')=>dispatch=>{
      http.get({
          url:'https://weread.qq.com/web/login/getinfo',
          params:params,
          queue:queue,
          callback:(res)=>{
           //若登录成功,应该重定向到已登录状态的主页
          }
      });
  }

复制

二.后端API接口/web/login/getinfo伪代码:

 public User getinfo(String uid){
       ......
           //循环查询uid在redis里是否存在值
           while(true){
               String user=redisTemplate.opsForValue().get(uid);
               if(user!=null){
                   return user;
               }
           }
      ......
  }

复制

用一个时序图来简单表示这个过程:

微信扫码登录的技术实现思考

那么,什么时候才能通过uid去redis查询才能得到返回值呢?

这时候,就要说到扫码阶段了。

当getinfo(String uid)接口在轮询查询redis是否有key为uid的值时,拿出手机,在二维码有效时间内,用微信扫一扫进行扫码操作,这时,手机上就会出现该页面展示:

微信扫码登录的技术实现思考

若点击登录,网页版微信读书就会刷新,进入到已登录状态的首页。

这个过程很好理解,即在扫码后,手机端会从二维码中获取到uid,这时,若点登录,就会将uid与微信用户信息一块包装成json格式post提交给后端,然后在后端接口中,将以uid:user的key-value形式set插入到redis数据库。这时,另一边正在以uid当做key值轮询去redis是否有值的getinfo(String uid)方法,正好就能查到刚插入到redis的值,这时通过类似redisTemplate.opsForValue().get(uid)的方式就能把刚插入的user信息查询出来,最后返回给PC端的微信读书前端,即登录成功。

最后,完整的流程可以时序图这样表示:

微信扫码登录的技术实现思考

PC端微信读书登录成功的时候,页面重新做了刷新,应该是在后台做了接口重定向,具体如何重定向,感兴趣的朋友可以自行思考研究,微信扫码登录大体上就是这个思路,但细节方面应该会有更多相关校验在里面。

这里主要是分析下它的整体实现思路。

值得提一点是,PC端微信读书前端其实做了反调试,但没关系,它这个反调试的做法很容易破解,可参考我的做法,即打开谷歌浏览器,按F12,调出控制台,把这个图标点亮,就可以关闭微信读书前端自带的反调试设置了。

文章来源:https://www.cnaaa.net,转载请注明出处:https://www.cnaaa.net/archives/10001

(0)
凯影的头像凯影
上一篇 2023年11月10日 下午3:09
下一篇 2023年11月13日 下午3:18

相关推荐

  • Pmail——仅用一分钟就可以搭建好一个邮箱服务器

    有一个自己的邮箱,是不是光想着就觉得很酷。在之前,我介绍过一个邮箱poste.io 的搭建过程。虽然说是用docker但是其实搭建起来还是挺麻烦的。今天再来介绍一个搭建简单的邮局系统 pmail。 项目的优势: 1、部署简单 2、资源占用极小 编译后二进制文件仅15MB,运行过程中占用内存10M以内。 3、安全方面 支持dkim、spf校验。正确配置的情况下…

    2024年7月2日
    2.3K00
  • Linux SSH 登录失败多少次禁止该IP访问 防止暴力破解

    Linux 系统SSH 登录失败的内容会记录到/var/log/secure文件,通过查找关键字 Failed,可以定位到这些异常的IP地址,比如: 比如这里,明显这个IP地址在进行SSH 扫描,不断的更换端口和用户进行暴力测试。 在Linux里面有两个相关的文件: /etc/hosts.allow: 允许哪些IP访问主机 /etc/hosts.deny 禁…

    2023年3月1日
    92400
  • 在 VMware 中安装 Kali Linux 系统的详细过程

    Kali Linux 是用于学习和练习黑客攻击和渗透测试的Linux发行版的不二之选。 而且,如果你经常捣鼓 Linux 发行版,出于好奇心,你可能已经尝试过它。 警告!本文介绍的内容仅供学习 Kali Linux 的安装,请勿使用 Kali Linux 进行任何非授权的行为。Kali Linux 应该用于在授权的情况下,对授权的目标进行合理的渗透测试,以了…

    2022年6月8日
    1.7K00
  • Prometheus监控Linux

    Linux 客户端安装docker  创建node-exporter 启动docker 浏览器验证 http://ip:9100/metrics  prometheus节点操作 配置prometheeus/prometheus.yaml CPU采集node_cpu_seconds_totalnode_cpu_seconds_total{ instance=&…

    2024年1月4日
    52500
  • CentOS7系统开机报错:you might want to save “/run/initramfs/rdsosreport.txt“ to a USB stick or /boot…

    一、报错场景我遇到的场景是Centos7强制下电,开机后报错,报错的大致意思是系统文件出现错误 具体报错如下 you might want to save “/run/initramfs/rdsosreport.txt“ to a USB stick or /boot after mounting them and attach it to a bug re…

    2023年10月16日
    1.0K00

发表回复

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

在线咨询: QQ交谈

邮件:712342017@qq.com

工作时间:周一至周五,8:30-17:30,节假日休息

关注微信