验证码制作
验证码功能:屏蔽机器请求,保障业务不受机器提交请求干扰
普通验证码制作
- 创建画布 imagecreatetrueccolor()[默认黑色的]
- 设置背景色取代黑色默认颜色imagecolorallocate()
- 填充背景色到画布上 imagefill()
- 为空白画布上添加字符 imagestring()
- 添加点干扰元素 imagesetpixel()
- 添加线干扰元素imageline()
验证码的动态校验
- 使用JS实现动态校验验证码
- 增加可点击的”换一个”文案
- 用JS选择器选取验证码图片
- 用JS选择器选取验证码图片
- 用JS修改验证码图片地址(修改src)
验证码的核心技术分析
- 底图的实现,并且添加干扰元素;依赖PHP图片处理GD
- 生成验证内容,简单的随机数生成,使用PHP函数mt_rand();随机数字+字母生成,需要ASCII码理论基础;随机中文内容生成,需要UTF-8编码理论基础;
- 验证内容保存在服务端;需要PHP操作SESSION基础;
- 验证内容的校验;需要前端Ajax基础;
Demo
captcha.php
<?php
//依赖GD扩展
$image=imagecreatetruecolor(100,30);
$bgcolor=imagecolorallocate($image,255,255,255);
imagefill($image,0,0,$bgcolor);//填充
for($i=0;$i<4;$i++){
$fontsize = 6;
$fontcolor = imagecolorallocate($image,rand(0,120),rand(0,120),rand(0,120));
$fontcontent = rand(0,9);//产生0~9之间的数字
$x = ($i*100/4+rand(5,10));
$y = rand(5,10);
imagestring($image,$fontsize,$x,$y,$fontcontent,$fontcolor);
}
//点干扰
for($i=0;$i<200;$i++){
$pointcolor=imagecolorallocate($image,rand(50,200),rand(50,200),rand(50,200));
imagesetpixel($image,rand(1,99),rand(1,29),$pointcolor);
}
//线干扰
for($i=0;$i<3;$i++){
$linecolor=imagecolorallocate($image,rand(80,220),rand(80,220),rand(80,220));
imageline($image,rand(1,99),rand(1,29),rand(1,99),rand(1,29),$linecolor);
}
header('content-type:image/png');
imagepng($image);
imagedestroy($image);
?>
captcha.php
这里将验证码保存在session中
<?php
// 依赖GD扩展
session_start();
$image=imagecreatetruecolor(100,30);
$bgcolor=imagecolorallocate($image,255,255,