验证码的作用：有效防止这种问题对某一个特定注册用户用特定程序暴力破解方式进行不断的登陆尝试，实际上是用验证码是现在很多网站通行的方式（比如招商银行的网上个人银行，腾讯的QQ社区），我们利用比较简易的方式实现了这个功能。虽然登陆麻烦一点，但是对社区还来说这个功能还是很有必要，也很重要。但我们还是提醒大家主要保护自己的密码，尽量使用混杂了数字、字母、符号在内的6位以上密码，不要使用诸如1234之类的简单密码或者与用户名相同、类似的密码。 不要因为只是来iclub问问问题，就随意设置密码，保护你自己的密码也是保护你自己，免得你的账号给人盗用给自己带来不必要的麻烦。 ~
(1）.验证码一般是防止批量注册的，人眼看起来都费劲，何况是机器。二像百度贴吧未登录发贴要输入验证码大概是防止大规模匿名回帖的发生目前，不少网站为了防止用户利用机器人自动注册、登录、灌水，都采用了验证码技术。所谓验证码，就是将一串随机产生的数字或符号，生成一幅图片， 图片里加上一些干扰象素（防止OCR），由用户肉眼识别其中的验证码信息，输入表单提交网站验证，验证成功后才能使用某项功能。
（2）.一般注册用户ID的地方以及各大论坛都要要输入验证码
（3）.常见的验证码
1，四位数字，随机的一数字字符串，最原始的验证码，验证作用几乎为零。2，CSDN网站用户登录用的是GIF格式，目前常用的随机数字图片验证码。图片上的字符比较中规中矩，验证作用比上一个好。没有基本图形图像学知识的人，不可破！可惜读取它的程序，在CSDN使用它的第一天，好像就在论坛里发布了，真是可怜！
3，QQ网站用户登录用的是PNG格式，图片用的随机数字+随机大写英文字母，整个构图有点张扬,每刷新一次,每个字符还会变位置呢!有时候出来的图片,人眼都识别不了,厉害啊…4，MS的hotmail申请时候的是BMP格式, 随机数字+随机大写英文字母+随机干扰像素+随机位置。
5，Google的Gmail注册时候的是JPG格式，随机英文字母+随机颜色+随机位置+随机长度。6，其他各大论坛的是XBM格式，内容随机。
（4）意义：不少网站为了防止用户利用机器人自动注册、登录、灌水，都采用了验证码技术。所谓验证码，就是将一串随机产生的数字或符号，生成一幅图片，图片里加上一些干扰象素（防止OCR），由用户肉眼识别其中的验证码信息，输入表单提交网站验证，验证成功后才能使用某项功能。
实现认证码技术，需要以下几方面的准备：
1．生成认证码：
我们可以让系统随机产生一个数字来作为认证码，这方面在Javascript脚本语言和JAVA语言中均可得以实现。前者可以用Math.random()得到一个介于0与1之间的小数，用它乘以10000再取整数部分，即可得到0至9999之间的随机数。后者可以用Random类的nextInt(N)方法得到一个介于0至N-1之间的随机类。
在实现时，我们采用了前者，即用Javascript生成的随机数作为认证码。主要原因是Javascript是HTML内置的脚本语言，不管页面是前进、后退还是刷新，都能保证及时产生新的认证码，增加了随机性。而用JAVA实现时，则不具备此特性，浏览器还保存原先的认证码，随机性不强。
2．生成认证码图象：
这是比较关键的部分。幸运的是，JAVA语言给我们提供了强大的支持。我们可以利用BufferedImage类在内存中绘制图象，并可利用ImageIO类将图象输出到JSP页面中。在绘制图象时，我们就可以将随机产生的认证码，绘制到图象中，进而展现在用户面前。另，为了增加破译的难度，我们可以随机画一些点。
3．保存认证码：
在JSP语言中，我们可以充分利用该语言内置的SESSION对象来保存认证码之值，方法是：session.setAttribute("认证码名字",认证码之值)。并可用session.getAttribute("认证码名字")得到系统保存的认证码之值，用来和用户输入的认证码相比较，很是方便。
三、认证码技术的JSP实现
1．image.jsp
这个JSP程序的功能是：根据页面参数rand生成相应的认证码图象，同时设定SESSION变量rand，以便check.jsp验证用户输入的认证码时使用。
源程序如下：
<%@ page contentType="image/jpeg" import="java.awt.*,
java.awt.image.*,java.util.*,javax.imageio.*" %>
<%
// 在内存中创建图象
int width=60, height=20;
BufferedImage image = new BufferedImage(width, height,
BufferedImage.TYPE_INT_RGB);
// 获取图形上下文
Graphics g = image.getGraphics();
// 设定背景色
g.setColor(Color.white);
g.fillRect(0, 0, width, height);
//画边框
g.setColor(Color.black);
g.drawRect(0,0,width-1,height-1);
// 取随机产生的认证码(4位数字)
String rand = request.getParameter("rand");
rand = rand.substring(0,rand.indexOf("."));
switch(rand.length())
{
case 1: rand = "000"+rand; break;
case 2: rand = "00"+rand; break;
case 3: rand = "0"+rand; break;
default: rand = rand.substring(0,4); break;
}
// 将认证码存入SESSION
session.setAttribute("rand",rand);
// 将认证码显示到图象中
g.setColor(Color.black);
g.setFont(new Font("Times New Roman",Font.PLAIN,18));
g.drawString(rand,10,15);
// 随机产生88个干扰点，使图象中的认证码不易被其它程序探测到
Random random = new Random();
for (int i=0;i<88;i++)
{
int x = random.nextInt(width);
int y = random.nextInt(height);
g.drawLine(x,y,x,y);
}
// 图象生效
g.dispose();
// 输出图象到页面
ImageIO.write(image, "JPEG", response.getOutputStream());
out.clear();
out = pageContext.pushBody();
%>
2．a.jsp
这个JSP程序的功能是：显示认证码，提供表单让用户输入认证码供校验用。注意，程序中显示认证码图象时，用了Javascript的document.write，并用了Math.random函数，从而保证了认证码的及时更新特性。
源程序如下：
<%@ page contentType="text/html;charset=gb2312" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>认证码输入页面</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
<META HTTP-EQUIV="Cache-Control" CONTENT="no-cache">
<META HTTP-EQUIV="Expires" CONTENT="0">
</head>
<body>
<form method=post action="check.jsp">
<table>
<tr>
<td align=left>系统产生的认证码：</td>
<td><script>document.write("<img border=0 src=image.jsp?
rand="+Math.random()*10000+"/>");</script></td>
</tr>
<tr>
<td align=left>输入上面的认证码：</td>
<td><input type=text name=rand maxlength=4 value=""></td>
</tr>
<tr>
<td colspan=2 align=center><input type=submit value="提交检测"></td>
</tr>
</form>
</body>
</html>
3．check.jsp
这个JSP程序的作用是比较用户输入的认证码与SESSION变量中保存的认证码，相同时提示认证成功，否则提示认证失败。
源程序如下：
<%@ page contentType="text/html; charset=gb2312" language="java"
import="java.sql.*" errorPage="" %>
<html>
<head>
<title>认证码验证页面</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
<META HTTP-EQUIV="Cache-Control" CONTENT="no-cache">
<META HTTP-EQUIV="Expires" CONTENT="0">
</head>
<body>
<%
String rand = (String)session.getAttribute("rand");
String input = request.getParameter("rand");
%>
系统产生的认证码为： <%= rand %><br>
您输入的认证码为： <%= input %><br>
<br>
<%
if (rand.equals(input)) {
%>
<font color=green>输入相同，认证成功！</font>
<%
} else {
%>
<font color=red>输入不同，认证失败！</font>
<%
}
%>
</body>
</html>
关于图片验证码设计的思考
自从读了《网站重构》这本书，现在对网站设计的思想有了根本性的改变。国内越来越多的媒体也极度关注WEB标准的进展情况，很多门户网站也开始使用符合标准的设计方法重新设计页面，像网易等。
这段时间正好在制作一个访谈系统，采用了符合W3C标准的布局方法，分别在IE5.5、IE6.0、IE7.0、Firefox 2.0、Opera 9.0环境下进行了测试，各不同厂商对CSS的理解也进一步趋于完善，这对于前台页面的制作人员减少了一定的工作量。
好了，归于正题，谈谈关于图片验证码设计的问题。
现在越来越多的网站的注册、发布等页面都采用了防止一些恶意程序的图片验证码选项，不知道大家有没有碰到这样的情况，一个注册表单，填写了帐号信息、个人信息，最后一项的验证码太模糊了竟然看不清，只能是重新刷新整个页面来刷新图片验证码的内容，这是一个不良好的交互设计。
参考了一些门户网站的方法，我的改进设计思路如下：
- 把验证码输入项放在表单的第一行；
- 客户端可以在不刷新整个页面的情况下更新图片验证码的内容。
下面重点讲讲第2点的实现方法，以JSP为例吧(^_^)。
我们一般要插入验证码都是使用<img />标签，例如<img src="image.jsp" />，其中image.jsp是一个生成图片的程序文件。为了能够更新验证码的内容，可以在图片旁边加一个更新的链接，单击触发图片重载事件，完成图片验证码的更换。具体代码如下：
HTML:
<a href="javascript:reloadcode();" title="更换一张验证码图片"><img src="image.jsp?rand=xxxx.0" id="safecode" alt="看不清，请换一张" /></a> <a href="javascript:reloadcode();" title="更换一张验证码图片">看不清，请换一张</a>
---------------------src="image.jsp?rand=xxxx.0" 中的xxxx.0是image.jsp方法中的规则。初始为自己定义。
JavaScript:
function reloadcode(){
document.getElementById('safecode').src = image.jsp?' + Math.random();
}
注意，在reloadcode函数中，我们在image.jsp后面加了一个随机参数，这样每次的链接地址都不一样，从而达到更新的目的。
1367
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
