Skip to content

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

Notifications You must be signed in to change notification settings

kxbin/img-captcha

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

10 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

img-captcha 图片验证码

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

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

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

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

查看example代码

example.gif

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

example2.gif

About

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

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • HTML 62.5%
  • JavaScript 29.8%
  • CSS 7.7%