Talk is Cheap, Show me the Code! <<网站首页文章列表

  • 来聊一聊这个被淘汰的图片验证码

    前言这里只讨论验证码的实现方法,不对验证码的用户体验进行探讨。下面就是今天要讨论的验证码样子:![图片](https://oomabc.com/staticsrc/img/202005/31/15908963708353912f9d6699c40babb335bf835eab827.jpg)从上图可以看出,这个验证码分为两部分:+ 点击区域(包含文字“猎技公网上科络”,其实就是猎上网络科技)。+ 下方提示区域(包含文字“猎上网络”),提示用户要在点击区域按顺序点击哪些文字。 -------- 点击区域的原始文字分布通过CSS定位,将点击区域的图片展示给用户,通过JS让用户可以在该区域的文字上进行点击和取消点击。 随机定位该区域文字是通过程序进行了随机定位,目的就是打乱顺序,提高识别词组的难度。 随机缩放对所有文字进行了随机的缩放,为了肉眼可辨认,缩放值在一定范围内,再次提高文字识别难度。缩放的原则就是人眼可以快速识别,但是干扰了机器识别。 随机旋转对所有文字在一定角度内进行了旋转,进一步提高识别难度。变形的原则就是,人眼快速识别,但是干扰机器识别。可以进一步对文字进行扭曲等等。 随机颜色对所有文字进行文字前景色的随机,结合背景色的混淆,进一步提高识别难度。 文字识别的干扰还可以对文字区域进行背景图片填充,通过增加像素点的颜色干扰提示识别难度。有时候增加背景图之后,背景图会与随机的文字颜色进行融合,不仅提高了机器识别难度,更增加了肉眼识别难度。因此可以在文字的同坐标下,增加一个与之同缩放同旋转的大一号的浅色相同的文字,作为文字描边。这个描边是在目标文字之下的,所以不会是一个完全描边,但是大大降低了肉眼识别难度。---- 目标文字分布通过CSS定位,将提示区域的图片展示给用户,并在图片前方提示用户“按顺序

    验证码   Java   图片处理   Canvas   2020-06-02 浏览(156) 阅读原文>>
  • 1 
    blogTest
    分享文章
     
    使用APP的"扫一扫"功能,扫描左边的二维码,即可将网页分享给别人。
    你也可以扫描右边本博客的小程序二维码,实时关注最新文章。