Js逆向实现滑动验证码图片还原的示例代码

  

本文列举两个例子:某象和某验的滑动验证

  

一、某验:<代码> aHR0cHM6Ly93d3cuZ2VldGVzdC5jb20vZGVtby9zbGlkZS1mbG9hdC5odG1s

  

未还原图像:

  

 Js逆向实现滑动验证码图片还原的示例代码

  

还原后的图:

  

 Js逆向实现滑动验证码图片还原的示例代码

  

从服务端请求来的图片是打乱后的,给用户看的时候是完整的,这个过程肯定是运行了某段js代码,将打乱的图片进行还原操作,所以我们需要找到这段js,然后还原它的代码逻辑,实现图片的还原操作,找到缺口距离,实现滑动操作。

  

如果你仔细观察的话,你会发现还原后的图它是帆布生成出来的

  

 Js逆向实现滑动验证码图片还原的示例代码

  

那你应该会想的到,那段js中会生成画布,然后使用它下面的一些方法,实现图片的还原操作,所以我们需要知道他啥时候生成画布,找到位置,然后慢慢往下调试,找到还原代码。

  

这时我们就需要使用油猴插件,进行了。如果对油猴不了解的同学,可以谷歌百度下,学习下,这是非常有用的,代码如下:

     //==UserScript==//@ name钩createElement//@namespace http://tampermonkey.net///@version 0.1//@description试图接管世界!//@author朱宇//@match *://*/*//@grant没有//==/UserScript==(函数(){   使用严格的;//你的代码……   让_createElement=document.createElement.bind(文档);      文档。createElement=函数(elm) {   console.log (“createElement:“榆树);   如果(榆树===盎肌?{//调试器;   }   返回_createElement (elm);   }   })();      

我们现在来看看效果,刷新页面:

  

 Js逆向实现滑动验证码图片还原的示例代码

  

那我们就可以能快速定位到创建画布的位置了,

  

 Js逆向实现滑动验证码图片还原的示例代码

  

下面就是慢慢分析代码了,具体就不多说了

  

 Js逆向实现滑动验证码图片还原的示例代码

  

 Js逆向实现滑动验证码图片还原的示例代码

  

 Js逆向实现滑动验证码图片还原的示例代码

  

这个例子主要就是对油猴插件(钩)的使用吧。

  

二,某象:<代码> aHR0cDovL2Nkbi5kaW5neGlhbmctaW5jLmNvbS9jdHUtZ3JvdXAvY2FwdGNoYS11aS9kZW1vLw==

  

同样的验证码图片还原也是使用帆布生成的,如果使用上面的方式的话,没啥效果的

  

 Js逆向实现滑动验证码图片还原的示例代码

  

但是通过搜索关键字画布<代码> 还是能过发现一些猫腻的。

  

 Js逆向实现滑动验证码图片还原的示例代码

  

 Js逆向实现滑动验证码图片还原的示例代码

  

 Js逆向实现滑动验证码图片还原的示例代码

  

 Js逆向实现滑动验证码图片还原的示例代码

  

好了,两个例子就是这样了,具体还原代码,有兴趣自己去实现吧。

  

到此这篇关于Js逆向实现滑动验证码图片还原的示例代码的文章就介绍到这了,更多相关Js逆向滑动验证码内容请搜索以前的文章或继续浏览下面的相关文章希望大家以后多多支持!

Js逆向实现滑动验证码图片还原的示例代码