滑动验证码原理实现

时间: 2018-11-24阅读: 4781标签: 验证

滑动验证码在很多网站逐步流行起来,一方面对用户体验来说,比较新颖,操作简单,另一方面相对图形验证码来说,安全性并没有很大的降低。当然到目前为止,没有绝对的安全验证,只是不断增加攻击者的绕过成本。

总的来说:滑动验证码是根据用户在滑动滑块的响应时间,拖拽速度,时间,位置,轨迹,重试次数等来评估风险。其交互时序图,可以如下概括:



滑动验证码的意义  

常见验证码是需要输入图中字符的,是因为机器识别字符比较困难,以此来防止机器自动的行为。但是滑动验证码只需要鼠标滑一下就可以了,用机器来模拟这个过程轻而易举,那滑动验证码的意义在哪里?

  1. 滑动验证码可以显著优化用户体验,这在互联网时代是非常重要的。
  2. 滑动验证码对机器的判断,不只是完成拼图,前端用户看不见的是——验证码后台针对用户产生的行为轨迹数据进行机器学习建模,结合访问频率、地理位置、历史记录等多个维度信息,快速、准确的返回人机判定结果,故而机器识别+模拟不易通过。
  3. 滑动验证码也不是万无一失,但对滑动行为的模拟需要比较强的破解能力,毕竟还是大幅提升了攻击成本,而且技术也会在攻防转换中不断进步。


滑动验证码核心流程分析

1.服务端随机生成抠图和带有抠图阴影的背景图片,服务端保存随机抠图位置坐标;

2.前端实现滑动交互,将抠图拼在抠图阴影之上,获取到用户滑动距离值;

3.前端将用户滑动距离值传入服务端,服务端校验误差是否在容许范围内;

备注说明:单纯校验用户滑动距离是最基本的校验,处于更高安全考虑,可以考虑用户滑动整个轨迹、用户在当前页面上的行为等,可以将其细化复杂地步,可以根据实际情况设计。亦或借助用户行为数据分析模型,最终的目标都是增加非法的模拟和绕过的难度。


滑动验证码分析与论证

A.分析

滑动图形验证码由抠块和带有抠块阴影的原图两部分组成,但是里面包含了两个重要特性保证被暴力破解的难度:

1.抠块的形状随机;

2.抠块所在原图的位置随机;

如此就可以在有限的图集中制造出随机的、无规律可寻的抠图和原图的配对。

B.产生随机形状

1.确定抠图轮廓

大家都知道图片是有像素组成,每个像素点对应一种颜色,颜色可以用RGB形式表示,外加一个透明度,由此可以抽象下模型如下:

把一张图理解成一个平面图形,左上角为原点,向右x轴,向下y轴,每个坐标值对应该位置像素点的颜色,由此就可以把一张图转换成一个二维数组。基于这个考虑,轮廓也用二维数组来表示,轮廓内元素值为1,轮廓外元素值对应0。

2.轮廓形状确定

有坐标系、有矩形、有圆形,由此用数学中解析几何思想,用圆的函数方程和矩形的边线的函数,具体如下:

(x-a)?+(y-b)?=r?中,其中三个参数a、b、r,即圆心坐标为(a,b),半径r。这些将抠图放在上文所述的坐标系上很容易就图算出来具体的值。


站长推荐

1.云服务推荐: 国内主流云服务商,各类云产品的最新活动,优惠券领取。地址:阿里云腾讯云华为云

2.广告联盟: 整理了目前主流的广告联盟平台,如果你有流量,可以作为参考选择适合你的平台点击进入

链接: http://www.fly63.com/article/detial/1410

关闭

你知道如何使用Node.js做邮箱验证吗?

相信大家都知道登录操作都会有一个接收验证码的过程,我之前一直对这个非常感兴趣,经常问同学手机验证码是怎么搞的,但是现在我们不用手机也照样可以实现这个功能。

javascript如何判断字符串是否全为字母?

正则表达式(英语:Regular Expression,在代码中常简写为regex、regexp或RE)使用单个字符串来描述、匹配一系列符合某个句法规则的字符串搜索模式。

javascript如何判断数字是否为浮点数?

JavaScript中可以使用正则表达式来判断是否是浮点数,判断前我们可以使用正则表达式来判断是否是数字。

vue短信验证性能优化写入localstorage中

当点击完按钮时,倒计时还没到60s过完时,刷新浏览器,验证码按钮又可以重新点击;就需要把时间都写到localstorage里面去,当打开页面的时候,就去localstorage里面去取,我这里就贴上我的解决方法,因为前几天有个vue的项目用到该方法

Vue中的验证登录状态

Vue项目中实现用户登录及token验证,先说一下我的实现步骤:使用easy-mock新建登录接口,模拟用户数据;使用axios请求登录接口,匹配账号和密码,账号密码验证后, 拿到token,将token存储到sessionStorage中,并跳转到首页

使用JavaScript策略模式校验表单

Web项目中,登录,注册等等功能都需要表单提交,当把用户的数据提交给后台之前,前端一般要做一些力所能及的校验,比如是否填写,填写的长度,密码是否符合规范等等,前端校验可以避免提交不合规范的表单。假如我们有一个表单,校验逻辑如下

验证码的分类_ 网页验证码有哪些方式?

早期的互联网是没有验证码的,随着后来计算机程序的发展,黑客编写了模仿登录、恶意破解密码、刷票、论坛灌水等恶意程序,破坏了整个网络的平衡性。介绍目前常用验证码的分类有哪些:Gif动画验证码、手机短信验证码、手机语音验证码、视频验证码、滑动验证码

javascript如何检查是否是浮点数?

JavaScript中可以使用正则表达式来判断是否浮点数。首先是判断是不是数字isNaN(),JavaScript中判断浮点数的正则表达式:在程序中的使用方法

jQuery.validator插件:密码正则验证的使用方法

jQuery.validator 是比较常用的一个表单验证插件,有20多种验证方式,下面介绍一下 jQuery.validator 正则验证的使用方法。jQuery.validator 提供了一个添加自定义验证方法

基于react的滑动图片验证码组件

业务需求,需要在系统登陆的时候,使用“滑动图片验证码”,来验证操作的不是机器人。在一般的页面组件引用即可。onReload这个函数一般是用来请求后台图片的。

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!