目录
一、相关工具及技术
1、相关工具
- 数据库：MySQL
- 编程工具：IDEA 企业版
2、相关技术
- 服务器：HttpServlet、BeanUtil
- 数据库：MyBatis
3、相关 jar 包
二、IDEA 创建 web 项目
1、创建空项目
（1）打开 IDEA 企业版，创建空项目LoginDemo。
（2）打开项目，在LoginDemo目录下右键，点击 添加框架支持。
（3）选择 Web应用程序
点击确定后，项目下多了一个 名为web的目录。
2、classes目录和lib目录配置
（1）右键web目录，创建两个新的目录 classes 和 lib 。
（2）配置 classes 目录
a、打开项目结构
b、选择模块，打开 路径 。选择 使用模块编译输出路径 选项
c、选择 classes 目录的路径
d、修改后，点击应用。
（3）配置 lib 目录
a、项目结构的模块中打开 依赖
b、点击 依赖 下面的 + 号（不是模块中的 + 号），选择 JAR或目录... 选项
c、选择 lib 目录的路径
d、选择 Jar Diirectory 选项，点击确定
e、依赖下出现刚刚选择的 lib 目录，选择并应用。
f、点击项目结构的 库 ，点击右上角的 + 号，选择 Java。
g、同样的选择 Jar Diirectory 选项，点击确定
h、点击确定
i、添加成功后，点击确定关闭项目结构。
3、tomcat 服务器配置
（1）点击编辑配置
（2）点击添加新的运行配置，找到 tomcat ，选择 本地 。
Tomcat 服务器是一个免费的开放源代码的Web 应用服务器，属于轻量级应用服务器。
下载地址：Apache Tomcat® - Welcome!任选一个版本进行下载，我这里选择的是Tomcat 9。下载之后解压到你知道的目录即可。
（3）配置 Tmocat 服务器，其中：
名称：任意填写
应用程序服务器：点击右边的配置按钮，进行配置
HTTP端口：默认8080
JMX端口：默认1099
输入你解压后 tomcat 的目录，主目录和基目录一般是选择一样的。
点击 部署，点击下方的加号，选择 工件...，添加工件。
选择 文件 -> 项目结构 -> 工件，将名称 ":" 后面的内容去掉，输出目录 "_" 后面的内容去掉（留下项目名），然后勾上两个按钮，点击确定。
（4）点击 服务，点击运行按钮。红色的字段不是报错，只是服务器运行输出的日志等内容，不用担心。当出现 部署已花费 XXX 毫秒 的字样，浏览器打开如下界面，即说明配置完成。
三、MySQL 配置
1、登录 mysql
输入 net start mysql 启动 mysql 数据库服务。
net start mysql
输入用户名、密码登录 mysql 。
mysql -u 你的用户名 -p
查看 mysql 中的数据库，选择你的数据库
show databases;use 你的数据库;
2、创建 user 表
我创建了一张 user 表，包含了 id,name,password 三个字段。其中 id 字段为主键，设置为自动增长。
create table user(
id int primary key auto_increment,
name varchar(20),
password varchar(20)
);
3、插入数据
插入一条记录，用于后面的测试
insert into user values(null,"admin","admin");
查看表
select * from user;
四、项目代码编写
1、整体思路
用户通过浏览器访问 login.html 页面，输入用户名的密码。服务器接收数据，通过servlet进行解析，如果正确，则跳转到 welcome.html 页面；否则重新跳转回 login.html 页面。
2、前端代码
由于这个Demo主要关注后端的代码，前端的代码就简单写了写，仅作为测试。
（1）index.html
这个页面是浏览器一打开就展示的界面
（在tomcat服务器的web.xml配置文件下有相关的配置）
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>开始界面</title>
</head>
<body>
<h1>欢迎您来到...首页</h1>
</body>
</html>附：tomcat服务器对各种资源的访问
对Servlet动态资源的访问：
对html静态资源的访问：
对index为名称的资源的访问：
tomcat服务器的web.xml文件 第4734行
（2）login.html
（注意这里 action 的 URL 别写错）
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>登录界面</title>
</head>
<body>
<form action="http://localhost:8080/LoginDemo/loginServlet" method="post">
姓名:<input type="text" name="name"><br>
密码:<input type="password" name="password"><br>
<input type="submit" value="登录">
</form>
</body>
</html>（3）welcome.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>欢迎界面</title>
</head>
<body>
<h1>欢迎您</h1>
<h2>登录成功</h2>
</body>
</html>3、后端代码
（1）项目结构
（2）相关 jar 包
BeanUtils需要导入3个Jar包：
commons-beanutils-1.9.3.jar
commons-beanutils-1.9.3-tests.jar
commons-logging-1.2.jar
MyBatis需要导入1个Jar包：
mybatis-3.5.11.jar
MySQL需要导入1个Jar包：
mysql-connector-j-8.0.31.jar
HttpServlet需要导入1个Jar包：
servlet-api.jar
打开 tomcat 解压目录下的 lib 目录，找到 servlet-api.jar
（3）User 类
a、使用 IDEA 企业版连接数据库
打开 IDEA 右侧的数据库，选择MySQL.
填写相关配置，主要是mysql的用户名和密码
点击数据源属性，选择你的数据库，找到 user 表。
b、通过工具创建 User 类
右键 user 表，选择 工具 -> 脚本化控制程序 -> Generate POJOs.groovy
选择需要生成的位置（pojo包下）
IDEA将自动生成 User 实体类，注意自动生成的包名可能需要自己改一下。
（4）MyBatis 相关配置
a、配置 jdbc.properties。创建 jdbc.properties 文件，填写数据库连接的相关消息，用于MyBatis的连接。
driver=com.mysql.cj.jdbc.Driver
url=jdbc:mysql://localhost:3306/db_study
username=root
password=rootb、配置 mybatis-config.xml。创建 mybatis-config.xml 文件，填写资源包、别名、环境、映射文件等的信息。
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE configuration PUBLIC "-//mybatis.org//DTD Config 3.0//EN"
"http://mybatis.org/dtd/mybatis-3-config.dtd">
<configuration>
<!--配置资源包-->
<properties resource="jdbc.properties"/>
<!--配置别名-->
<typeAliases>
<typeAlias type="com.pojo.User" alias="user"/>
</typeAliases>
<!--配置环境-->
<environments default="mysql">
<environment id="mysql">
<transactionManager type="JDBC"/>
<dataSource type="POOLED">
<property name="driver" value="${driver}"/>
<property name="url" value="${url}"/>
<property name="username" value="${username}"/>
<property name="password" value="${password}"/>
</dataSource>
</environment>
</environments>
<!--配置映射文件-->
<mappers>
<mapper resource="com/dao/UserMapper.xml"/>
</mappers>
</configuration>
（5）UserDao 类
定义接口 UserDao 类，这里使用的是xml的方式编写SQL语句，另一种方式是通过注解的方式编写。通过 UserMapper.xml 实现接口。
package com.dao;
import com.pojo.User;
public interface UserDao {
User findByNameAndPassword(User user);
}
（6）UserMapper.xml 映射文件
填写SQL语句，实现接口。
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
"http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<!--配置具体映射文件,namespace属性是指定具体要操纵的类-->
<mapper namespace="com.dao.UserDao">
<select id="findByNameAndPassword" resultType="user" parameterType="user">
select *
from user
where name = #{name}
and password = #{password}
</select>
</mapper>（7）LoginServlet 类
这里编写的实现MySQL语句查询，判断页面跳转的代码。login.html页面通过 acton 的URL跳转到该类。
首先通过注解的方式配置路径
@WebServlet("/loginServlet")实现doPost方法
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
... ...
}将tomcat的服务器编码设置为 utf-8 ，避免用户post时中文乱码的问题。
req.setCharacterEncoding("utf-8");通过 getParameterMap() 方法获取请求参数
Map<String, String[]> map = req.getParameterMap();创建 User 类，通过BeanUtils类打包。
// 创建 user 对象
User user = new User();
// 将 map 中的请求参数封装到 user 对象中
try {
BeanUtils.populate(user, map);
} catch (IllegalAccessException | InvocationTargetException e) {
throw new RuntimeException(e);
}通过MyBatis 获取 UserDao 代理类，查询数据库并返回查询结果。
// 获取流对象，读取核心配置文件
InputStream is = Resources.getResourceAsStream("mybatis-config.xml");
// 创建 sqlSessionFactoryBuilder 工厂构建者对象
SqlSessionFactoryBuilder sqlSessionFactoryBuilder = new SqlSessionFactoryBuilder();
// 获取 sqlSessionFactory 工厂对象
SqlSessionFactory sqlSessionFactory = sqlSessionFactoryBuilder.build(is);
// 获取 SqlSession 对象
SqlSession sqlSession = sqlSessionFactory.openSession();
// 获取 UserDao 代理类对象
UserDao userDao = sqlSession.getMapper(UserDao.class);
// 调用 userDao
User result = userDao.findByNameAndPassword(user);
// sqlSession 提交
sqlSession.commit();
// sqlSession 关闭
sqlSession.close();判断结果是否为 null，决定请求转发的方向。
// 判断 result 是否为 null
if (result == null) {
// 没有该用户，跳转到 login.html
req.getRequestDispatcher("/login.html").forward(req, resp);
} else {
// 有该用户，跳转到 welcome.html
req.getRequestDispatcher("/welcome.html").forward(req, resp);
}LoginServlet 类全部代码：
package com.servlet;
import com.dao.UserDao;
import com.pojo.User;
import org.apache.commons.beanutils.BeanUtils;
import org.apache.ibatis.io.Resources;
import org.apache.ibatis.session.SqlSession;
import org.apache.ibatis.session.SqlSessionFactory;
import org.apache.ibatis.session.SqlSessionFactoryBuilder;
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 java.io.IOException;
import java.io.InputStream;
import java.lang.reflect.InvocationTargetException;
import java.util.Map;
@WebServlet("/loginServlet")
public class LoginServlet extends HttpServlet {
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
this.doPost(req, resp);
}
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
req.setCharacterEncoding("utf-8");
// 获取请求参数
Map<String, String[]> map = req.getParameterMap();
// 创建 user 对象
User user = new User();
// 将 map 中的请求参数封装到 user 对象中
try {
BeanUtils.populate(user, map);
} catch (IllegalAccessException | InvocationTargetException e) {
throw new RuntimeException(e);
}
// 获取流对象，读取核心配置文件
InputStream is = Resources.getResourceAsStream("mybatis-config.xml");
// 创建 sqlSessionFactoryBuilder 工厂构建者对象
SqlSessionFactoryBuilder sqlSessionFactoryBuilder = new SqlSessionFactoryBuilder();
// 获取 sqlSessionFactory 工厂对象
SqlSessionFactory sqlSessionFactory = sqlSessionFactoryBuilder.build(is);
// 获取 SqlSession 对象
SqlSession sqlSession = sqlSessionFactory.openSession();
// 获取 UserDao 代理类对象
UserDao userDao = sqlSession.getMapper(UserDao.class);
// 调用 userDao
User result = userDao.findByNameAndPassword(user);
// sqlSession 提交
sqlSession.commit();
// sqlSession 关闭
sqlSession.close();
// 判断 result 是否为 null
if (result == null) {
// 没有该用户，跳转到 login.html
req.getRequestDispatcher("/login.html").forward(req, resp);
} else {
// 有该用户，跳转到 welcome.html
req.getRequestDispatcher("/welcome.html").forward(req, resp);
}
}
}
五、验证
1、登录成功
2、登录失败
