Java实现滑动验证码的示例代码

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

接下来分析下滑动验证码的核心流程:

后端随机生成抠图和带有抠图阴影的背景图片,后台保存随机抠图位置坐标

前端实现滑动交互,将抠图拼在抠图阴影之上,获取到用户滑动距离值,比如以下示例

前端将用户滑动距离值传入后端,后端校验误差是否在容许范围内。

这里单纯校验用户滑动距离是最基本的校验,出于更高的安全考虑,可能还会考虑用户滑动的整个轨迹,用户在当前页面的访问行为等。这些可以很复杂,甚至借助到用户行为数据分析模型,最终的目标都是增加非法的模拟和绕过的难度。这些有机会可以再归纳总结常用到的方法,本文重点集中在如何基于Java来一步步实现滑动验证码的生成。

可以看到,滑动图形验证码,重要有两个图片组成,抠块和带有抠块阴影的原图,这里面有两个重要特性保证被暴力破解的难度:抠块的形状随机和抠块所在原图的位置随机。这样就可以在有限的图集中制造出随机的、无规律可寻的抠图和原图的配对。

用代码如何从一张大图中抠出一个有特定随机形状的小图呢?

第一步,先确定一个抠出图的轮廓,方便后续真正开始执行图片处理操作

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

这时候就要想这个轮廓形状怎么生成了。有坐标系、有矩形、有圆形,没错,用到数学的图形函数。典型用到一个圆的函数方程和矩形的边线的函数,类似:

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

示例代码如下:

 private int[][] getBlockData() {
 int[][] data = new int[targetLength][targetWidth];
 double x2 = targetLength-circleR-2;
 //随机生成圆的位置
 double h1 = circleR + Math.random() * (targetWidth-3*circleR-r1);
 double po = circleR*circleR;

 double xbegin = targetLength-circleR-r1;
 double ybegin = targetWidth-circleR-r1;

 for (int i = 0; i < targetLength; i++) {
  for (int j = 0; j < targetWidth; j++) {
  //右边○
  double d3 = Math.pow(i - x2,2) + Math.pow(j - h1,2);

  if (d1 <= po
   || (j >= ybegin && d2 >= po)
   || (i >= xbegin && d3 >= po)
   ) {
   data[i][j] = 0;

  } else {
   data[i][j] = 1;
  }
  }
 }
 return data;
 }

第二步,有这个轮廓后就可以依据这个二维数组的值来判定抠图并在原图上抠图位置处加阴影。

操作如下:

private void cutByTemplate(BufferedImage oriImage,BufferedImage targetImage, int[][] templateImage, int x,
  int y){
 for (int i = 0; i < targetLength; i++) {
  for (int j = 0; j < targetWidth; j++) {
  int rgb = templateImage[i][j];
  // 原图中对应位置变色处理

  int rgb_ori = oriImage.getRGB(x + i, y + j);

  if (rgb == 1) {
          //抠图上复制对应颜色值
   targetImage.setRGB(i, y + j, rgb_ori);
   int r = (0xff & rgb_ori);
   int g = (0xff & (rgb_ori >> 8));
   int b = (0xff & (rgb_ori >> 16)));
   rgb_ori = r + (g << 8) + (b << 16) + (200 << 24);
          //原图对应位置颜色变化
   oriImage.setRGB(x + i, y + j, rgb_ori);
  }
  }
 }
 }

经过前面两步后,就得到了抠图和带抠图阴影的原图。为增加混淆和提高网络加载效果,还需要对图片做进一步处理。一般有两件事需要做,一对图片做模糊处理增加机器识别难度,二做适当同质量压缩。模糊处理很容易想到高斯模糊,原理很好理解,大家可以去google了解下。具体到Java里面的实现,有很多版本,现在不借助任何第三方jar,提供一个示例:

public static ConvolveOp getGaussianBlurFilter(int radius,
      boolean horizontal) {
    if (radius < 1) {
      throw new IllegalArgumentException("Radius must be >= 1");
    }

    int size = radius * 2 + 1;
    float[] data = new float[size];

    float sigma = radius / 3.0f;
    float twoSigmaSquare = 2.0f * sigma * sigma;
    float sigmaRoot = (float) Math.sqrt(twoSigmaSquare * Math.PI);
    float total = 0.0f;

    for (int i = -radius; i <= radius; i++) {
      float distance = i * i;
      int index = i + radius;
      data[index] = (float) Math.exp(-distance / twoSigmaSquare) / sigmaRoot;
      total += data[index];
    }

    for (int i = 0; i < data.length; i++) {
      data[i] /= total;
    }    

    Kernel kernel = null;
    if (horizontal) {
      kernel = new Kernel(size, 1, data);
    } else {
      kernel = new Kernel(1, size, data);
    }
    return new ConvolveOp(kernel, ConvolveOp.EDGE_NO_OP, null);
  }

public static void simpleBlur(BufferedImage src,BufferedImage dest) {
   BufferedImageOp op = getGaussianBlurFilter(2,false);
   op.filter(src, dest);
 }

经测试模糊效果很不错。另外是图片压缩,也不借助任何第三方工具,做同质压缩。

public static byte[] fromBufferedImage2(BufferedImage img,String imagType) throws IOException {
 bos.reset();
 // 得到指定Format图片的writer
 Iterator<ImageWriter> iter = ImageIO.getImageWritersByFormatName(imagType);
 ImageWriter writer = (ImageWriter) iter.next(); 

 // 得到指定writer的输出参数设置(ImageWriteParam )
 ImageWriteParam iwp = writer.getDefaultWriteParam();
 iwp.setCompressionMode(ImageWriteParam.MODE_EXPLICIT); // 设置可否压缩
 iwp.setCompressionQuality(1f); // 设置压缩质量参数

 iwp.setProgressiveMode(ImageWriteParam.MODE_DISABLED);

 ColorModel colorModel = ColorModel.getRGBdefault();
 // 指定压缩时使用的色彩模式
 iwp.setDestinationType(new javax.imageio.ImageTypeSpecifier(colorModel,
 colorModel.createCompatibleSampleModel(16, 16)));

 writer.setOutput(ImageIO
 .createImageOutputStream(bos));
 IIOImage iIamge = new IIOImage(img, null, null);
 writer.write(null, iIamge, iwp);

 byte[] d = bos.toByteArray();
 return d;
 }

至此,滑动验证码核心的代码处理流程已全部结束,这里面有很多细节可以不断打磨优化,让滑动体验可以变得更好。希望可以帮助到某些准备自己构建滑动验证码的同学。

以上代码实现都非常的精炼,一方面为了保证性能,另一方面好理解。另外由于各方面原因也不便引入过多细节,如果疑问,可留言交流。经测试,该生成滑动图形的流程响应时间可以控制在20ms左右,如果原图分辨率在300px*150px以下,可以到10ms左右,在可接受范围内。如果有更高效的方式,希望多多指教。也希望大家多多支持我们。

(0)

相关推荐

  • Java实现仿淘宝滑动验证码研究代码详解

    通过下面一张图看下要实现的功能,具体详情如下所示: 现在我就来介绍些软件的其它功能.希望大家有所受益. 模拟人为搜索商品 在刷单的时候,不能直接拿到一个商品网址就进入购买页面吧,得模拟人为搜索. 在这一个过程中有两个难点: 1)商品列表的异步加载 ; 2)翻页并且截图; 在园子里,我就不在关公面前耍大刀了. 直接上关键代码: i:搜索商品,并且翻页 public bool? SearchProduct(TaskDetailModel taskDetailData) { bool? result

  • Java selenium处理极验滑动验证码示例

    要爬取一个网站遇到了极验的验证码,这周都在想着怎么破解这个,网上搜了好多知乎上看到有人问了这问题,我按照这思路去大概实现了一下. 1.使用htmlunit(这种方式我没成功,模拟鼠标拖拽后轨迹没生成,可以跳过) 我用的是java,我首先先想到了用直接用htmlunit,我做了点初始化 private void initWebClient() { if (webClient != null) { return; } webClient = new WebClient(BrowserVersion.

  • selenium+java破解极验滑动验证码的示例代码

    摘要 分析验证码素材图片混淆原理,并采用selenium模拟人拖动滑块过程,进而破解验证码. 人工验证的过程 1.打开威锋网注册页面 2.移动鼠标至小滑块,一张完整的图片会出现(如下图1) 3.点击鼠标左键,图片中间会出现一个缺块(如下图2) 4.移动小滑块正上方图案至缺块处 5.验证通过 selenium模拟验证的过程 加载威锋网注册页面 下载图片1和缺块图片2 根据两张图片的差异计算平移的距离x 模拟鼠标点击事件,点击小滑块向右移动x 验证通过 详细分析 1.打开chrome浏览器控制台,会

  • Java实现滑动验证码的示例代码

    最近滑动验证码在很多网站逐步流行起来,一方面对用户体验来说,比较新颖,操作简单,另一方面相对图形验证码来说,安全性并没有很大的降低.当然到目前为止,没有绝对的安全验证,只是不断增加攻击者的绕过成本. 接下来分析下滑动验证码的核心流程: 后端随机生成抠图和带有抠图阴影的背景图片,后台保存随机抠图位置坐标 前端实现滑动交互,将抠图拼在抠图阴影之上,获取到用户滑动距离值,比如以下示例 前端将用户滑动距离值传入后端,后端校验误差是否在容许范围内. 这里单纯校验用户滑动距离是最基本的校验,出于更高的安全考

  • 基于C#实现图片滑动验证码的示例代码

    目录 图片准备 合成目标 实现 1.创建项目 2.Nuget添加ImageSharp 3.vscode打开 4.引入图片 5.生成out_bg.jpg 6.生成out_slider.png 全部代码 最后 图片准备 hole.png和slider.png为png是因为图片带有透明度. 合成目标 最终为前端生成两张图片: out_slider.png高度为344与背景图等高. 也可以打开滑动验证Demo页面,F12来观察图片. 实现 本机环境为.net 6.0.300-preview.22204.

  • Java实现动态获取图片验证码的示例代码

    本文介绍了Java实现动态获取图片验证码的示例代码,分享给大家,具体如下: import javax.imageio.ImageIO; import java.awt.*; import java.awt.image.BufferedImage; import java.io.FileOutputStream; import java.io.IOException; import java.io.OutputStream; import java.io.UnsupportedEncodingEx

  • java生成图片验证码的示例代码

    给大家分享一款java生成验证码的源码,可设置随机字符串,去掉了几个容易混淆的字符,还可以设置验证码位数,比如4位,6位.当然也可以根据前台验证码的位置大小,设置验证码图片的大小.下边是源码分享,直接看吧,很简单! 创建servlet类 import java.io.IOException; import javax.servlet.Servlet; import javax.servlet.ServletException; import javax.servlet.http.HttpServ

  • Java实现短信验证码的示例代码

    目录 项目需求 需求来由 代码实现 发送验证码方法 注册方法 忘记密码 前端代码 编码中遇到的问题 如何改进 短信验证码相信大家都不陌生吗,但是短信验证码怎么生成的你真的了解吗,本文揭示本人项目中对短信验证码的. 项目需求 用户注册/忘记密码添加短信验证码 需求来由 登录注册页面需要确保用户同一个手机号只关联一个账号确保非人为操作,避免系统用户信息紊乱增加系统安全性 代码实现 同事提供了WebService接口,很好,之前没调过,又增加了困难. 这边用的阿里云的短信服务,废话少说上图,呸,上代码

  • 使用DrawerLayout完成滑动菜单的示例代码

    用Toolbar编写自定义导航栏,在AndroidManifest.xml中你要编滑动菜单的界面处加入如下代码 <activity android:name=".DrawerLayoutActivity" android:theme="@style/NoTitle"></activity> 在values下的styles.xml中加入 <style name="NoTitle" parent="Theme.

  • .NET 6实现滑动验证码的示例详解

    目录 CaptchaData.cs CaptchaValidateData.cs ImageCaptchaInfo.cs Resource.cs SliderImageCaptchaInfo.cs SlideTrack.cs TemplatePair.cs Track.cs 本节创建的类全部在工程的Model目录下: CaptchaData.cs CaptchaData.cs:验证码的数据类实体 namespace SlideCaptcha.Model { public class Captch

  • vue生成随机验证码的示例代码

    本文介绍了vue生成随机验证码的示例代码,分享给大家,具体如下: 样式自调,最终效果如图: 实现效果: 点击右边input框会自动切换,如果输入的值与字不同,则清空换一串随机数 HTML <input type="text" placeholder="请输入验证码" class="yanzhengma_input" @blur="checkLpicma" v-model="picLyanzhengma"

  • Java连接postgresql数据库的示例代码

    本文介绍了Java连接postgresql数据库的示例代码,分享给大家,具体如下: 1.下载驱动jar 下载地址:https://jdbc.postgresql.org/download.html 2.导入jar包 新建lib文件夹,将下载的jar驱动包拖到文件夹中. 将jar驱动包添加到Libraries 3.程序代码如下:HelloWorld.java package test; import java.sql.Connection; import java.sql.DriverManage

随机推荐