Posted on 2008-10-19 21:27
夢與橋 閱讀(680)
評論(0) 編輯 收藏
通過設(shè)置response對象的contentType屬性為image/jpeg,以圖片的形式顯示一個(gè)隨機(jī)驗(yàn)證碼。包括login.jsp、verifycode.jsp、checklogin.jsp與error.jsp。login.jsp為提交信息頁面,verifycode.jsp生成驗(yàn)證碼,checklogin.jsp檢驗(yàn)驗(yàn)證碼,error.jsp為登錄出錯(cuò)轉(zhuǎn)向的頁面。
§login.jsp的code如下:

<%
@ page contentType="text/html; charset=GBK" %>
<html>
<head>
<title>
用戶登錄頁面
</title>
</head>
<body bgcolor="#ffffff">
<h1>
請輸入用戶登錄信息
</h1>
<form name="userinfo" action="checklogin.jsp" method="POST" onsubmit="return(checkinfo())">
<table border="1">
<tr>
<td>用戶名:</td>
<td><input type="text" name="username"/></td>
<td><a href="register.jsp">用戶注冊</a></td>
</tr>
<tr>
<td>密碼:</td>
<td><input type="password" name="password"/></td>
<td><a href="forgetpassword.jsp">忘記密碼了</a></td>
</tr>
<tr>
<td>驗(yàn)證碼:</td>
<td><input type="text" name="verifycode"/></td>
<td><img alt="" src="verifycode.jsp" /></td>
</tr>
<tr>
<td><input type="submit" value="登錄"/></td>
<td><input type="reset" value="重置"/></td>
<td></td>
</tr>

</table>
</form>

<script >

function checkinfo()
{
var oObject = document.all.item("userinfo");

for (i = 0; i < oObject.length; i++)
{

if (oObject(i).value.length==0)
{
alert("必填項(xiàng)的值不能為空");
oObject(i).focus();
return false;
}
}

return true;

}
</script>
</body>
</html>
verifycode.jsp的code如下:

<%
@ page pageEncoding="gb2312" %>

<%
@ page import="java.awt.*,java.awt.image.*,java.util.*,javax.imageio.*" %>

<%
@ page import="java.io.OutputStream" %>

<%
response.setContentType("image/jpeg");
response.addHeader("Content-Disposition","attachment;filename=verifycode.jpg" );
//定義一個(gè)整型變量用于存放生成的隨機(jī)數(shù)
int icode=0;
//在內(nèi)存中生成一個(gè)圖片以及寬、高、類型
BufferedImage image=new BufferedImage(50,16,BufferedImage.TYPE_INT_RGB);
//生成一個(gè)2D的圖形
Graphics g =image.getGraphics();
//設(shè)置圖形為白色
g.setColor(Color.white);
//填充圖象
g.fillRect(0,0,50,16);
//新建一個(gè)隨機(jī)對象
Random random=new Random();
//取出4位整數(shù)
while(icode<=1000)
{
icode=random.nextInt(10000);
};
//把隨機(jī)整數(shù)轉(zhuǎn)換成字符串
String scode=icode+"";
//將生成隨機(jī)校驗(yàn)碼存入session中
session.setAttribute("verifycode",scode);
//設(shè)置圖形的顏色為黑色
g.setColor(Color.BLACK);
//把生成的隨機(jī)數(shù)做為字符串寫到圖形中
g.drawString(scode,12,12);
//從response.getOutputStream()得到一個(gè)輸出流對象
ServletOutputStream os=response.getOutputStream();
//輸出到頁面(不知道我的理解是否正確)
ImageIO.write(image,"JPEG",os);
//關(guān)閉輸出流對象
os.flush();
os.close();
%>
checklogin.jsp的code如下:

<%
@ page contentType="text/html; charset=GBK" %>
<html>
<head>
<title>
responseDemo
</title>
</head>
<body bgcolor="#ffffff">
<h1>
用戶登錄信息
</h1>

<%
String name=request.getParameter("name");
String password=request.getParameter("password");
if (password.equalsIgnoreCase("000000")){
//從Session中取得驗(yàn)證碼的值
String verifycode=(String)session.getAttribute("verifycode");
//從客戶端取用戶提交過來驗(yàn)證碼
String verifycode1=request.getParameter("verifycode");
if (verifycode.equalsIgnoreCase(verifycode1)){
%>
用戶登錄成功,客戶端輸入驗(yàn)證碼為:<%= verifycode1%>

<%
}
}else{
response.sendRedirect("dispatcherDemo.jsp");
}
%>
</body>
</html>
error.jsp的code如下:

<%
@ page contentType="text/html; charset=GBK" %>
<html>
<body bgcolor="#ffffff">
<h1>
登錄出錯(cuò)
</h1>
</body>
</html>