shenzhim / img-captcha

基于canvas的图片滑块式验证码

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

img-captcha 图片验证码

主要是采用canvas在图片源上的随机位置进行不规则图形的抠图,然后拖动抠出的图形进行位置匹配验证。

当然,在前端进行随机随机位置的选择存在不安全性,更保险的方式还是在服务端讲抠好的图片传到前端来进行验证。

支持传入多张图片,随机选择某一张图片进行验证

运行起来大概是这样的^_^(可能加载的有点慢)

查看example代码

example.gif

优化后的抠图算法,效果如下,相比而言,没有了黑边,体验更好点。

example2.gif

About

基于canvas的图片滑块式验证码


Languages

Language:HTML 62.5%Language:JavaScript 29.8%Language:CSS 7.7%