JSP 设计教师与学生不同登陆界面(带验证码)
Posted gamedev˚
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JSP 设计教师与学生不同登陆界面(带验证码)相关的知识,希望对你有一定的参考价值。
实验三 设计教师与学生不同登陆界面
一、实验目的
1、掌握代码片段中的注释的应用;
2、掌握JSP脚本标示—Java代码片段的应用。
二、实验内容
1、设计教师与学生不同登陆界面,如下图;
2、验证码随机生成;
3、提交后分别转向教师页面和学生页面进行判断用户名和密码正确性;
4、如果正确,3秒后,转向成功页面,否则跳回验证页面;
三、实验方法
1、在同一页面上设计两个单选按钮:教师、学生,当点击提交按钮后,进入相应的JSP页面。当用户名及密码均正确时,进入欢迎界面;如果两者其一不正确就要提醒需要重新输入。在这些操作中,注意request内置对象的正确使用方法;
2、类似于1,使用request和out对象;
3、学习使用重定向方法解决实验内容3。
四、实验学时:2学时(第5周)
五、实验代码
代码目录结构:
效果展示
源码
Login.jsp
<html>
<head>
<script type="text/javascript">
function reImg()
var img = document.getElementById("Img");
img.src = "image.jsp?code=" + Math.random();
</script>
</head>
<body>
<div align="center" style="padding-top: 2em">
<span style="font-size: 3em">用户登录/LOGIN</span> <br>
——————————————————————
<form action="login_check.jsp" method="post">
<table style="padding-left: 1em;">
<tr>
<td>用户名:</td>
<td><input type=text name=name />
</td>
</tr>
<tr>
<td>密 码:</td>
<td><input type="password" name="password" />
</td>
</tr>
<tr>
<td>验证码:</td>
<td><input type="text" name="yanzhengma" /><img border=0
id="Img" src="image.jsp" alt="验证码"><a href="#"
onclick="reImg();">看不清,请点击刷新</a>
</td>
</tr>
</table>
<table style="padding-left: 0.6em">
<tr>
<td><input type=radio name=type value=partment>部门 <input
type=radio name=type value=teacher>教师 <input type=radio
name=type value=student checked>学生 <input type=radio
name=type value=guest>访客</td>
</tr>
<tr>
<td><input type="submit" value="登录" /> <input type="reset"
value="重置" />
</td>
</tr>
</table>
</form>
</div>
</body>
</html>
login_check.jsp
<%@ page contentType="text/html; charset=gb2312"%>
<%
//获取Login.html提交来的信息
String name = request.getParameter("name");
String password = request.getParameter("password");
String type = request.getParameter("type");
//检查用户登录是否成功,这里假设用户名密码均为为admin就表示登录成功,
if (name.equals("admin") && password.equals("admin"))
//验证码验证
String input = request.getParameter("yanzhengma");
String code = (String) session.getAttribute("code");
if (input.equals(code))
out.print("<script>alert('验证成功!');</script>");
///验证通过后,将用户信息写入session对象,
session.setAttribute("name", name);
session.setAttribute("password", password);
session.setAttribute("type", type);
///根据用户选择的权限类型跳转页面,
if (type.equals("partment"))
response.sendRedirect("partment.jsp");
else if (type.equals("teacher"))
response.sendRedirect("teacher.jsp");
else if (type.equals("student"))
response.sendRedirect("student.jsp");
else if (type.equals("guest"))
response.sendRedirect("guest.jsp");
else
out.print("<script language='JavaScript' type='text/JavaScript'>alert('异常!请重新登录!');</script>");
response.sendRedirect("Login.jsp");
else
out.print("<script>alert('验证失败!');window.location.href='Login.jsp';</script>");
else
//登录失败,回到Login.jsp页面。
out.print("<script>alert('请正确填写信息!');window.location.href='Login.jsp'</script>");
%>
image.jsp
(验证码图片生成)
<%@ page contentType="image/JPEG"
import="java.awt.*,java.awt.image.*,java.util.*,javax.imageio.*"
pageEncoding="GBK"%>
<%!Color getRandColor(int fc, int bc) //给定范围获得随机颜色
Random random = new Random();
if (fc > 255)
fc = 255;
if (bc > 255)
bc = 255;
int r = fc + random.nextInt(bc - fc);
int g = fc + random.nextInt(bc - fc);
int b = fc + random.nextInt(bc - fc);
return new Color(r, g, b);
%>
<%
//设置页面不缓存
response.setHeader("Pragma", "No-cache");
response.setHeader("Cache-Control", "no-cache");
response.setDateHeader("Expires", 0);
// 在内存中创建图象
int width = 60, height = 20;
BufferedImage image = new BufferedImage(width, height,
BufferedImage.TYPE_INT_RGB);
// 获取图形上下文
Graphics g = image.getGraphics();
//生成随机类
Random random = new Random();
// 设定背景色
g.setColor(getRandColor(200, 250));
g.fillRect(0, 0, width, height);
//设定字体
g.setFont(new Font("Times New Roman", Font.PLAIN, 18));
//画边框
//g.setColor(new Color());
//g.drawRect(0,0,width-1,height-1);
// 随机产生155条干扰线,使图象中的认证码不易被其它程序探测到
g.setColor(getRandColor(160, 200));
for (int i = 0; i < 100; i++)
int x = random.nextInt(width);
int y = random.nextInt(height);
int xl = random.nextInt(12);
int yl = random.nextInt(12);
g.drawLine(x, y, x + xl, y + yl);
// 取随机产生的认证码(4位数字)
String sRand = "";
for (int i = 0; i < 4; i++)
String rand = String.valueOf(random.nextInt(10));
sRand += rand;
// 将认证码显示到图象中
g.setColor(new Color(20 + random.nextInt(110), 20 + random
.nextInt(110), 20 + random.nextInt(110)));//调用函数出来的颜色相同,可能是因为种子太接近,所以只能直接生成
g.drawString(rand, 13 * i + 6, 16);
// 将认证码存入SESSION
session.setAttribute("code", sRand);
// 图象生效
g.dispose();
// 输出图象到页面
ImageIO.write(image, "JPEG", response.getOutputStream());
%>
partment.jsp
(部门跳转显示JSP)
<%@ page contentType="text/html; charset=gb2312"%>
<%
//由于password是跳转的依据,因此借助session中是否有password信息来判断用户是否有登录,
if (session.getAttribute("password") == null)
out.print("<script>alert('请管理员先登录!');window.location.href='Login.html'</script>");
//由于管理员与用户登录后session中都会有信息且相同,会有以user权限登录后向该管理页面跳转的可能,所以要进行权限判断,
if (session.getAttribute("type") == null
|| !session.getAttribute("type").equals("partment"))
out.print("<script>alert('你不是部门人员,请重新登录!');window.location.href='Login.html'</script>");
%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>部门登录</title>
</head>
<body>欢迎部门人员登录!
</body>
</html>
teacher.jsp
(教师跳转显示JSP)
<%@ page contentType="text/html; charset=gb2312"%>
<%
//由于password是跳转的依据,因此借助session中是否有password信息来判断用户是否有登录,
if (session.getValue("password") == null)
out.print("<script>alert('请教师先登录!');window.location.href='Login.html'</script>");
%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>教师登录</title>
</head>
<body>欢迎教师登录!
</body>
</html>
student.jsp
(学生跳转显示JSP)
<%@ page contentType="text/html; charset=gb2312"%>
<%
//由于password是跳转的依据,因此借助session中是否有password信息来判断用户是否有登录,
if (session.getValue("password") == null)
out.print("<script>alert('请学生先登录!');window.location.href='Login.html'</script>");
%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>学生登录</title>
</head>
<body>欢迎学生登录!
</body>
</html>
guest.jsp
(客人跳转显示JSP)
<%@ page contentType="text/html; charset=gb2312"%>
<%
//由于password是跳转的依据,因此借助session中是否有password信息来判断用户是否有登录,
if (session.getValue("password") == null)
out.print("<script>alert('请访客先登录!');window.location.href='Login.html'</script>");
%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>访客登录</title>
</head>
<body>欢迎访客登录!
</body>
</html>
以上是关于JSP 设计教师与学生不同登陆界面(带验证码)的主要内容,如果未能解决你的问题,请参考以下文章