13518219792
最近滑动验证码在很多网站逐步流行起来，一方面对用户体验来说，比较新颖，操作简单，另一方面相对图形验证码来说，安全性并没有很大的降低。当然到目前为止，没有绝对的安全验证，只是不断增加攻击者的绕过成本。
接下来分析下滑动验证码的核心流程：
后端随机生成抠图和带有抠图阴影的背景图片，后台保存随机抠图位置坐标
前端实现滑动交互，将抠图拼在抠图阴影之上，获取到用户滑动距离值，比如以下示例
前端将用户滑动距离值传入后端，后端校验误差是否在容许范围内。
这里单纯校验用户滑动距离是最基本的校验，出于更高的安全考虑，可能还会考虑用户滑动的整个轨迹，用户在当前页面的访问行为等。这些可以很复杂，甚至借助到用户行为数据分析模型，最终的目标都是增加非法的模拟和绕过的难度。这些有机会可以再归纳总结常用到的方法，本文重点集中在如何基于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 h2 = 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 - h2,2);
if (d1 <= po
|| (j >= ybegin && d2 >= po)
|| (i >= xbegin && d3 >= po)
) {
data[i][j] = 0;
} else {
data[i][j] = 1;
}
}
}
return data;
}
