1. 背景
按照猫哥的一般习惯,做一个项目的顺序如下:
先搞定数据库
搞定Java Web项目基本结构,包括数据库相关操作类
开发Java Web各项功能
测试、部署
这个顺序呢,是有经验的人做项目的顺序。对初学者来说不够直观,而且容易使人厌倦,非常无聊,是故,抛弃之。
这次猫哥从看的见摸得着的网页出发,然后网页需要后台提供啥功能,就搞啥。后台需要数据库啥样,就弄啥样。
2. 编写登录页面
用户要使用系统,首先就得访问登录页面,设计一个最简单的登录页面login.jsp如下。
提示:如果还不知道如何建立Java Web工程,不知道login.jsp页面放到哪个目录,我还是建议您先看下我之前的入门教程。
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>login.jsp</title>
</head>
<body>
<form id="mainForm" method="post" action="/HomeworkSystem/LoginServlet">
请输入用户名:<input type="text" name="userName" />
<br/>
请输入密码:<input type="password" name="userPassword"/>
<br/>
<input type="submit" value="登录"/>
</form>
</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
接下来我仔细的解释下。
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>,这个用来表示当前页面是jsp页面,使用语言是java,页面编码是utf-8,注意该编码支持中文,如果不用该编码的话,可能会引起页面中文显示乱码问题。
<html>表示这是一个网页开始部分,注意由于上面一行已经说明了这是一个jsp动态网页了,所以实际上还是按动态网页进行处理的。
<head>部分是网页头部,设置了网页的标题为login.jsp。
<form>部分是表单,表单内容会以post方式提交到/HomeworkSystem/LoginServlet,注意这个提交地址是个相对地址,其含义表单被提交给HomeworkSystem项目的/LoginServlet。
表单中有三个控件,分别用来输入用户名(userName),密码(userPassowrd),再有一个登录按钮,点击按钮后提交表单。
3. 获取表单输入内容
上面说了,点击按钮后,将表单内容提交给/LoginServlet。所以,我们来编写LoginServlet,以处理登录页面提交的登录请求,首先就是要获取用户提交表单中输入内容。
@WebServlet("/LoginServlet")
public class LoginServlet extends HttpServlet {// 用于处理登录请求的LoginServlet
public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
this.doPost(request, response);// 直接调用doPost方法处理get请求
}
public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {// 处理post请求
// 设置输入输出格式、编码
response.setContentType("text/html");
request.setCharacterEncoding("utf-8");
response.setCharacterEncoding("utf-8");
// 获取用户在网页输入的用户名和密码
String userName = request.getParameter("userName");
String userPassword = request.getParameter("userPassword");
}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
接下来我仔细的解释下。
@WebServlet("/LoginServlet"),表示当前类接受/LoginServlet路径的请求,这样刚刚表单提交的请求就正好要被这个类处理了。
public class LoginServlet extends HttpServlet,继承HttpServlet就直接具备了处理网页http请求的能力,这就是继承的好处。
doGet方法直接调用dotPost方法,也就是说对于网页发起的get/post请求,都是由doPost方法处理。
doPost方法比较关键,当表单提交后,由于我们写了method="post",所以请求就由该方法处理,相应的请求参数都会被自动放入request对象,非常方便。
首先设置了输入输出的格式和编码,这是为了防止乱码,固定写法,记住就行。
String userName = request.getParameter("userName");,其中userName对应网页里面<input type="text" name="userName" />的userName,所以表单提交后,文本框中输入的用户名的值就赋给了变量userName了。
这样,我们的后端Servlet就已经知道网页上用户填写的用户名和密码了,这两个信息已经存入变量userName和userPassword 。
3. 处理登录请求
现在,用户的登录请求抛给了我们的Servlet处理,此时的逻辑应该如下设计:
如果用户名或密码为空,提示用户用户名密码不能为空
如果用户名或密码错误,提示用户重新输入
如果用户名和密码都正确,跳转到相应用户页面。
因为存在校长、教师、学生三种不同的角色,不同角色登录后页面显示内容不同。
根据以上讨论,我们至少知道我们需要用户的信息有:用户名,密码,角色(校长、教师、学生),另外为了避免用户名重复,我们需要一个唯一标识id(就像QQ上网名可以重复,但是QQ号是唯一的)。此处我们先不管数据库(实际用到的时候再去实现),先把用户这个类设计出来。
4. 编写用户类
既然是面向对象设计,就得针对现实社会中的对象,有一个对应的程序中虚拟对象(类)。我们根据上面的讨论设计用户类如下:
package org.maoge.model;
public class User {
private int userId;
private String userName;
private String userPassword;
private String userRole;
// 省略get set方法
}
1
2
3
4
5
6
7
8
接下来我们解释下。
因为是面向对象开发,所以现实社会中一个真实的用户,在内存(java代码中)就对应一个User类的对象,而在数据库中就对应用户表中的一条记录。
userRole用户角色,在此处就是写死的三种:校长、教师、学生,所以我们直接在数据库中写死就可以了,此处直接用一个字符串表示即可。
5. 封装登录服务
我们现在需要操作数据库了,以便查询用户输入的用户名、密码是否正确。
但是此时我们可以不用直接把数据库操作模块实现,先调用一个服务类,再由服务类去具体调用数据库操作即可。
这就好比,我们是八路军指挥官一样,直接让三团上去干鬼子,至于三团怎么干鬼子,让三团长自己想办法,先把命令下去再说。
此处建立登录服务类如下,用于封装登录时需要的方法,需要调用数据时,再从登录服务调用数据库。(Servlet是控制器,总体调度,他不管下面的服务具体如何去搞数据库)。
服务类定义如下:
package org.maoge.service;
public class LoginService {
}
1
2
3
结合需求分析,我们需要向LoginService这个小团长,下达检查登录指令。这个指令描述如下:
指令:检查登录
动作:检查userName和userPassword是否正确
行动结果:成功:把此人带来见我!我要根据他的能力(校长、教师、学生)给他安排工作。
行动结果:失败:执行失败原因(无此人?信息错误?..)
1
2
3
4
所以我们设计检查登录方法如下:
public class LoginService {
public User checkLogin(String userName, String userPassword) throws Exception {
if (userName.equals("") || userPassword.equals("")) {
// 抛出输入信息异常
throw new Exception("用户名和密码不能为空");
}
User user = null;
try {
// 从数据库中执行查询
} catch (Exception e) {
// 抛出数据库异常
throw new Exception("数据库操作异常:" + e.getMessage());
}
return user;// 返回查询结果
}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
好的,这样一看,我们后续只需要把执行用户查询的语句放在//从数据库中执行查询处,就可以了。
6. 完善登录控制
好的,此时,我们就可以在LoginServlet中调用LoginService 完成数据库操作了,代码如下:
public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {// 处理post请求
// 设置输入输出格式、编码
response.setContentType("text/html");
request.setCharacterEncoding("utf-8");
response.setCharacterEncoding("utf-8");
// 获取用户在网页输入的用户名和密码
String userName = request.getParameter("userName");
String userPassword = request.getParameter("userPassword");
LoginService lc = new LoginService();
User user = null;
try {
user = lc.checkLogin(userName, userPassword);
if (user == null) {
// 跳转到错误提示页面,并提示用户不存在
}
// 根据用户角色显示不同内容
} catch (Exception e) {
// 跳转到错误提示页面,并提示相应错误信息
}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
7. 跳转错误信息提示页面
根据用户不同角色显示不同内容,是一个比较复杂的事情,这个猫哥下一篇博客再论,我们来先来实现比较简单的跳转到错误提示页面,并提示相应错误信息。
修改LoginServlet 为:
LoginService lc = new LoginService();
User user = null;
String tipInfo = "";// 提示内容
String page = "";// 跳转页面
try {
user = lc.checkLogin(userName, userPassword);
if (user == null) {
// 跳转到错误提示页面,并提示用户不存在
tipInfo = "用户不存在";
page = "tip.jsp";
}
// 根据用户角色显示不同内容
} catch (Exception e) {
// 跳转到错误提示页面,并提示相应错误信息
tipInfo = e.getMessage();
page = "tip.jsp";
}
request.setAttribute("tipInfo", tipInfo);// 设置提示信息
request.getRequestDispatcher("/" + page).forward(request, response);// 跳转到page页面
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
此处解释下,request.setAttribute("tipInfo", tipInfo);// 设置提示信息,可以将tipInfo放入request对象,以便跳转到tip.jsp页面后显示其内容。
request.getRequestDispatcher("/" + page).forward(request, response);// 跳转到page页面,执行改行代码,将跳转到/[page]对应的页面,由于page是变量,所以实际跳转的页面以变量的值为准。
好的,最后,设计tip.jsp为,这个页面比较简单,就是直接显示提示信息。
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%><!-- 使用c:标签需要添加本行代码 -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>tip.jsp</title>
</head>
<body>
<!-- 如果tipInfo为空 -->
<c:if test="${empty tipInfo}">
欢迎使用猫哥培训班管理系统
</c:if>
<!-- 如果tipInfo不为空,显示 tipInfo -->
<c:if test="${not empty tipInfo}">
提示信息:${tipInfo}<br />
</c:if>
</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
7. 测试
重新部署、运行后,测试输入空的内容,提交后发现:错误信息:用户名或者密码为空,如果随便输如用户名密码,提交后发现:错误信息:用户名或者密码错误。