1. The purpose of the experiment
1. Understand the working principle of Servlet;
2. Master the application of javabean in web programs;
3. Master the MVC model based on Servlet;2. Experimental requirements
Master Servlet programming technology.
2. Master the use of javabean in Web programs to implement business logic
3. Proficiency in using IDE to develop Servlet applications
4. Master the annotation function of Servlet3.03. Experimental content
1. Refer to the example of teaching material P142, use JSP, Servlet, JavaBean to realize the user login verification program based on MVC mode.
2. On the basis of completing the above experiment, additional functions such as image verification code, automatic login and logout can be added.
The framework is as follows:
loginCheck.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>loginCheck.jsp</title>
<script type="text/javascript" language = "javascript">
var allforms = document.forms;
function check(){
//单击一次提交 调用函数之前先清掉上一次的检查信息。
userNameSpan.innerText = "";
pswSpan.innerText="";
//验证用户名
var len =allforms[0].name.value.length;
if(len<3 || len>15){
userNameSpan.innerText = "Please enter more than 3 characters.";
return false;
}
//验证密码
len = allforms[0].pwd.value.length;
if(len<3){
pswSpan.innerText = "Please enter more than 3 digits password.";
return false;
}
}
//验证码
var code ;
function createCode(){
code = new Array();
var codeLength = 5;
var checkCode = document.getElementById("checkCode");
checkCode.value = "";
var selectChar = new Array(2,3,4,5,6,7,8,9,'A','B','C','D','E','F','G','H','J','K','L','M','N','P','Q','R','S','T','U','V','W','X','Y','Z');
for(var i=0;i<codeLength;i++) {
var charIndex = Math.floor(Math.random()*32);
code +=selectChar[charIndex];
}
checkCode.value = code;
}
function validate () {
var inputCode = document.getElementById("yzm").value.toUpperCase();
if(inputCode != code ){
alert("验证码错误！"); return false; }
else {
alert("验证码正确！"); return true; }
}
</script>
</head>
<body onLoad="createCode();" background="colorful.png">
<h1><font color="#844220" >login</font></h1>
<strong style="margin-left:100px;cursor:pointer;height:40px;width:235px">
<font color="#844220" >会员登陆</font>
</strong>
<form action="loginCheckServlet" method="post">
<table>
<tr>
<td><label>用户账号：</label></td>
<td><input class = "input1" type="text" name="name" placeholder="more than 3 characters" size="20"/>
<span id = "userNameSpan" class = "span1"></span></td>
</tr>
<tr>
<td><label>密码：</label></td>
<td><input class = "input1" type="password" name="pwd" placeholder="more than 3 digits password" size="21"/>
<span id = "pswSpan" class = "span1"></span></td>
</tr>
<tr>
<td><label>验证码：</label></td>
<td><input type="text" id="yzm" size="7"/>
<input type="button" id="checkCode" onClick="createCode()" title="刷新验证码" style="width:70px;color:#F00;border:0;letter-spacing:1px;font-family:Arial;" /></td>
</tr>
<tr>
<td><input type="submit" value="提交" οnclick= "check();validate();"/></td>
<td><input type="reset" value="重置"/></td>
</tr>
</table>
</form>
</body>
</html>
loginSuccess.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>loginSuccess.jsp</title>
</head>
<body>
<jsp:useBean id="user" type="dto.User" scope="request"/>
<strong><font color="#844220">恭喜<jsp:getProperty property="name" name="user"/>登陆成功！</font></strong>
<br/>
<input type="button" value="点击注销" onclick="location.href='loginCheck.jsp'"/>
</body>
</html>
User class
package dto;
/*User类获取用户名和密码*/
public class User {
private String name;
private String pwd;
public String getName() {
return name;
}
public void setName(String name) {
this.name=name;
}
public String getPwd() {
return pwd;
}
public void setPwd(String pwd) {
this.pwd=pwd;
}
}
UserCheck class
package service;
import dto.User;
public class UserCheck {
//登陆验证
public boolean validate(User user) {
if(user!=null&&user.getName().equals("一刀一个小西瓜")) {
if(user.getPwd().equals("3182052051908")) {
return true;
}
return false;
}
return false;
}
}
loginCheckServlet
package servlet;
import java.io.IOException;
import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import service.UserCheck;
import dto.User;
@WebServlet(name="loginCheckServlet",urlPatterns= {
"/loginCheckServlet"})
public class LoginCheckServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doPost(request,response);
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
request.setCharacterEncoding("utf-8");
String name=request.getParameter("name");
String pwd=request.getParameter("pwd");
User user=new User();
user.setName(name);
user.setPwd(pwd);
UserCheck uc=new UserCheck();
if(uc.validate(user)) {
request.setAttribute("user", user);
RequestDispatcher dis=request.getRequestDispatcher("loginSuccess.jsp");
dis.forward(request, response);
} else {
System.out.println("账号密码错误。");
response.sendRedirect("loginCheck.jsp");
}
}
}