上一篇博文中实现了一个完全基于前端的验证码,不过由于其完全是由文本实现,所以安全性上有很大问题。当然一般情况下的验证码都是图片格式的,在网上搜索学习了一番之后,发现图片格式的验证码的实现步骤一般为:
1. 采用标签作为验证码的容器,其src属性值为生成验证码图片的链接地址(PHP、JSP等);
2. 服务器端生成验证码图片(即1中的链接)的同时,在session中放入验证码的真实值;
3. 在验证码的判断逻辑中检查前台传入的输入和session中验证码值;
4. 如果需要的话,可以为界面中的验证码添加刷新功能。
下面的代码是通过PHP实现的算术题式图片验证码,备用:
前台HTML:
[html] view plaincopy
验证码#code {
cursor: pointer;
}
document.getElementById("code").onclick = function() {
this.src = "code.php?t=" + Math.random();
}
验证码图片生成code.php:
[php] view plaincopy
$cimg = imagecreate(100, 30);
imagecolorallocate($cimg, 14, 114, 180); // background color
$red = imagecolorallocate($cimg, 255, 0, 0);
$num1 = rand(1, 99);
$num2 = rand(1, 99);
session_start();
$_SESSION['code'] = $num1 + $num2;
imagestring($cimg, 5, 5, 5, $num1, $red);
imagestring($cimg, 5, 30, 5, "+", $red);
imagestring($cimg, 5, 45, 5, $num2, $red);
imagestring($cimg, 5, 70, 5, "=?", $red);
header("Content-type: image/png");
imagepng($cimg)
?>
判别逻辑check.php:
[php] view plaincopy
session_start();
if ($_SESSION['code'] == $_POST['input']) {
echo "Pass!";
} else {
echo "Wrong input!";
}
?>
本文来源站长中心 www.software8.co 转载请注明
人打赏
0人 点赞
主帖获得的天涯分:0
举报 |
楼主
|
楼主发言:1次 发图:0张 | 添加到话题 |