JS逆向---极验三代系列详解-最全流程（一）分析接口，底图还原部分

---

前言

原创文章，请勿转载！
本文内容仅限于安全研究，不公开具体源码。维护网络安全，人人有责。
本文关联文章超链接：
JS逆向—极验三代系列详解-最全流程（一）分析接口，底图还原部分
JS逆向—极验三代系列详解-最全流程（二）分析JS， w值参数生成-RSA算法部分
后续更新

滑块验证码是我们在互联网上经常遇见的校验是否人类操作行为的一种检测方式，大概流程就是生成一张图片，然后随机挖去一块，在页面展示被挖去部分的图片，再通过js获取用户滑动距离，以及坐标等信息到后台进行校验。只要用户移动的距离符合，以及移动的轨迹行为检测通过即可视为验证通过。

而大部分开发者做爬虫时经常需要绕过该此类验证码进行下一步的爬虫，本文仅对极验geetest平台下的滑块验证码的图片还原进行分析与研究，试图找到打乱图片到正常图片之间的还原函数以及解析它还原算法的原理。

---

声明
本文章中所有内容仅供学习交流使用，不用于其他任何目的，不提供完整代码，抓包内容、敏感网址、数据接口等均已做脱敏处理，严禁用于商业用途和非法用途，否则由此产生的一切后果均与作者无关。
本文章未经许可禁止转载，禁止任何修改后二次传播，擅自使用本文讲解的技术而导致的任何意外，作者均不负责，若有侵权，请联系作者立即删除，请各位自觉遵守相关法律法规。

---

逆向分析

• 目标：https://www.geetest.com/demo/slide-float.html（仅使用官方demo案例学习交流）
• 逆向参数：gt,challenge,w,callback四个值比较可疑 + 底图还原

对于底图还原逻辑的py分析

对于底图还原部分，我们先挨个分析其接口以及网站发的包，看一下每一部分的具体逻辑，具体逻辑如下：

接口：https://www.geetest.com/demo/gt/register-slide?t=1703038233004
携带载荷-时间戳
返回challenge值，gt值
    challenge: "9196fd975b68171924c9e9c4bdda70cb"
    gt: "019924a82c70bb123aae90d483087f94"
    new_captcha: true
    success: 1
进行滑动-接口：https://api.geetest.com/ajax.php
携带载荷-gt,challenge,w,callback四个值比较可疑
    gt: 019924a82c70bb123aae90d483087f94
    challenge: 9196fd975b68171924c9e9c4bdda70cb8z
    callback: geetest_1703038349899

1. 分析接口
直接先进行刷新
接口：register-slide
    载荷-携带时间戳
    返回---challenge值， gt值
        challenge: "790fc0592dc8a9ebb2c6ca3f3c9774a8"
        gt: "019924a82c70bb123aae90d483087f94"

接口：gettype.php
    载荷-携带gt值(由register-slide接口可得)， callback值(geetest_ + 时间戳)
    返回---一些js文件

接口：get.php
    载荷-携带gt值， challenge值(都由register-slide接口可得)，w1值(加密值，推测可能为环境校验)， callback值(geetest_ + 时间戳)
    返回---c数组(一个9位数组)， 一些响应提示语

点击按钮进行验证
接口：ajax.php
    载荷-携带gt值， challenge值(都由register-slide接口可得)，w2值(加密值，推测可能为环境校验)， callback值(geetest_ + 时间戳)
    返回---result: "slide"
        status: "success"

接口：slide.7.9.2.js
    一个js文件，推测可能是进实现行底图分割的js文件

接口：get.php
    载荷-携带gt值， challenge值(都由register-slide接口可得)， type值(推测为版本号)，  callback值(geetest_ + 时间戳)
    返回---c数组(一个9位数组)，
          改变后的challenge值(就在响应里面)
          challenge: 790fc0592dc8a9ebb2c6ca3f3c9774a8hb
          响应提示语，
          图片信息也在这一部分返回，包括bg: 背景缺口图(乱序)，fullbg: 背景图(乱序)，slice: 缺口图

接口：refresh.php
    载荷-携带gt值， 改变后的challenge值(由get.php接口可得)， callback值(geetest_ + 时间戳)
    返回---challenge值(再次改变)
    challenge: 790fc0592dc8a9ebb2c6ca3f3c9774a8c4

拖动滑块完成拼图
接口：ajax.php
    载荷-携带gt值， challenge值(由refresh.php接口可得)，w3值(加密值，推测可能为环境校验)， callback值(geetest_ + 时间戳)
    返回---validate: "7a30f499241dfa139a3a5d6c5d04a5d5"(也就是我们最终所需要的值)


接口分析完毕
开始对滑块的JS逆向进行调试
    由以上接口分析，进行观察分析调试的过程中需要做什么
        1.理解并获取到三次变换的challenge值
        2.找到并分析背景缺口图(乱序)，背景图(乱序)，还原的代码
        3.找到并分析w值是如何生成

底图还原部分的具体为
首先确定乱序图片位置获取接口，综上所述可知，该接口为第二次请求的get.php接口，想要获取到接口的正常响应的图片数据，主要有以下几个需要主要的参数：
1.携带初始接口register-slide响应的gt， challenge值
2.携带点击按钮进行验证后出现的接口ajax.php，该接口的响应cookies值（该接口的w值可置空，对于获取到set-cookies值不影响）
最后即可获取到正确的返回的图片信息
结果如下

对于底图还原部分的js分析

首先定位一下图片位置

观察一下，发现这一部分，使用的canvas， 它是一个用于在网页上绘制图形、图像和动画的元素， Canvas 元素本身是一个矩形区域，可以用来绘制各种形状、文本、图像和其他内容。你可以使用 JavaScript 的 Canvas API 来操作 Canvas 元素
我们可以使用开发者工具事件监听器断点里面画布功能进行找相关的位置，对其进行刷新，然后跟栈进行分析


跳入到平坦流中，这一部分单步执行，然后跟着分析一下作用

然后发现，Ut[_]就是我们的底图还原的顺序逻辑

还原一下算法逻辑，不然不好分析（当然，硬扣也可以，其实我就是硬扣哈哈哈哈哈哈）

主要逻辑生成部分就是for循环的部分， Ut就是底图还原的顺序，整体逻辑其实就是经过循环，分割，然后重新拼接成正常顺序的逻辑
扣下来，改一下，写成自己的逻辑，这一部分即是底图还原逻辑,效果如下




底图还原部分至此分析完毕

写在最后：
本人写作水平有限,如有讲解不到位或者讲解错误的地方,还请各位大佬在评论区多多指教,共同进步.如有需要代码和讲解交流，可以加本人微信18847868809