极验滑动验证码图片还原

极验滑动验证码图片还原

极验的图片进行了分块乱序处理，本地加载后，会通过JavaScript对图片进行还原。
下载的图片:

调试方法：

  1. 在创建Canvas的函数上设置断点。

  2. 刷新验证码，会在创建Canvas的地方断下来。

  3. 一直单步，直到还原后的图像显示出来。

  4. 在console中执行z=i,将此时的i保存为全局变量。退出单步，刷新验证码，再次断到创建Canvas的地方，此时在console中执行z['$_BBJV']('ready')，然后继续单步，就可以即时显示一块一块被还原的图片。

  5. 至此，定位到了图片还原的关键代码，验证一下。

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    <!DOCTYPE html>
    <html>
    <body>
    <canvas id="myCanvas1" width="312" height="160">
    Your browser does not support the HTML5 canvas tag.
    </canvas>
    <br>
    <canvas id="myCanvas2" width="312" height="160">
    Your browser does not support the HTML5 canvas tag.
    </canvas>
    <br>
    <img id="img1" src="7d3e55d7a.webp" onload="main()" style="display:none;" >
    <script>
    	function main() {
        var c = document.getElementById("myCanvas1");
        var cxt = c.getContext("2d");
        var img = document.getElementById("img1");
        cxt.drawImage(img, 0, 0);
        cxt.fillStyle="white";
        var c2 = document.getElementById("myCanvas2");
        var cxt2 = c2.getContext("2d");
        SEQUENCE = [39, 38, 48, 49, 41, 40, 46, 47, 35, 34, 50, 51, 33, 32, 28, 29, 27, 26, 36, 37, 31, 30, 44, 45, 43, 42, 12, 13, 23, 22, 14, 15, 21, 20, 8, 9, 25, 24, 6, 7, 3, 2, 0, 1, 11, 10, 4, 5, 19, 18, 16, 17];
        r = 160;
        for (var a = r / 2, u = 0; u < 52; u += 1) {
            var c = SEQUENCE[u] % 26 * 12 + 1,
            _ = 25 < SEQUENCE[u] ? a: 0,
            l = cxt.getImageData(c, _, 10, a);
            cxt2.putImageData(l, u % 26 * 10, 25 < u ? a: 0);
    		cxt.fillRect(c, _, 10, a);
        }
    }
    </script>
    </body>
    </html>