利用 canvas 破解 某拖动验证码

近来想刷某站的帐号，难点始终是验证码，发现该站使用的是 所谓的新型验证码，拖动补全 的类型，咋一看好复杂的样子，仔细一看好像简单的样子，于是研究研究之~~

canvas 验证码识别

目录[-]

Part 1 识别

Patr 2 模拟

案例： https://www.capy.me/products/ whois 查询发现应该是一个日本公司出的。

Part 1 识别

读取原图： 随便多刷新几次，读两张图片，用 PS 补成原图。





对比图片：利用canvas的特性 getImageData 读取像素，然后和你想要识别的图片对比，找出被挖出去的部分。

计算补全： 然后就简单啦，计算好被挖出部分在x 和 y 方向的偏移量，然后把 小图移动过去，OK 搞定。。。





代码示例： 看runjs： http://sandbox.runjs.cn/show/gfeesnxw (代码写的乱，大家将就着看看 --..)

Patr 2 模拟

页面模拟：除了知道怎么识别图片位置，还需要知道怎么在页面模拟鼠标拖动操作，将图片移动到合适的位置。

在页面拖动一个元素，差不多看成是3个事件的组合：mousedown，mousemove，mouseup。

那么首先需要创建事件，定义好一个差不多的函数吧：

?
然后就是用js代码模拟拖动：

?
上面这段代码不是通用的，只是一个例子，可以去这里 https://www.capy.me/account/signup 用浏览器控制台输入代码测试。代码中的数字 10 就是移动的 像素，自行按需修改哦~

好了，这样就能写个程序自动注册帐号了，呵呵....

后话：这里还有个 http://geetest.com/tryit/ 叫极验的， 大致看了下，感觉也是类似的， 没有破解的需求，我就不伤脑筋去研究了。

源地址：http://my.oschina.net/u/237940/blog/337194?fromerr=fddQTU2w