Servlet模拟页面登陆-连接数据库
1.mysql的jar包放入WEB-INF-lib
image.png
2. 新建文件夹放数据库配置文件db.properties
image.png
3.在mysql数据库中建表tb_user
image.png
4. 在java中创建数据库工具类打开数据库连接
image.png
package com.shsxt.util;
import java.io.InputStream;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.util.Properties;
/**
* 数据库工具类
* 1、打开数据库连接
* 2、关闭资源
*
* 常见的报错情况：
* 1、数据库的jar包未拷贝到lib目录下
* java.lang.ClassNotFoundException: com.mysql.jdbc.Driver
* 2、数据库的密码可能不正确：
* java.sql.SQLException: Access denied for user 'root'@'localhost' (using password: YES)
* 3、数据库名称不正确
* com.mysql.jdbc.exceptions.jdbc4.MySQLSyntaxErrorException: Unknown database 'java29'
*
*
* @author Lisa Li
*
*/
public class DBUtil {
// 得到配置文件对象
private static Properties properties = new Properties();
static {
try {
// 得到db.properties的输入流对象
InputStream inputStream = DBUtil.class.getClassLoader().getResourceAsStream("db.properties");
// 通过properties的load()方法，加载配置文件的输入流
properties.load(inputStream);
} catch (Exception e) {
// 打印异常
e.printStackTrace();
}
}
/**
* 得到数据库连接
* 1、加载驱动
* 2、通过地址、账号、密码得到数据库连接
* @return
*/
public static Connection getConnection() {
Connection connection = null;
// 从配置对象中获取参数 getProperty()
String jdbcName = properties.getProperty("jdbcName");
String dbUrl = properties.getProperty("dbUrl");
String dbName = properties.getProperty("dbName");
String dbPwd = properties.getProperty("dbPwd");
try {
// 1、加载驱动
Class.forName(jdbcName);
// 2、通过地址、账号、密码得到数据库连接
connection = DriverManager.getConnection(dbUrl, dbName, dbPwd);
} catch (Exception e) {
e.printStackTrace();
}
return connection;
}
/**
* 关闭资源
* @param connection
* @param preparedStatement
* @param resultSet
*/
public static void close(Connection connection, PreparedStatement preparedStatement, ResultSet resultSet) {
// 关闭资源
try {
// 先判断不为空，再关闭
if (resultSet != null) {
resultSet.close();
}
if (preparedStatement != null) {
preparedStatement.close();
}
if (connection != null) {
connection.close();
}
} catch (Exception e) {
e.printStackTrace();
}
}
public static void main(String[] args) {
System.out.println(getConnection());
}
}
字符串工具类判断字符串是否为空
package com.shsxt.util;
/**
* 字符串工具类
* @author Lisa Li
*
*/
public class StringUtil {
/**
* 判断字符串是否为空
* 为空，返回true；否则返回false
* @param str
* @return
*/
public static boolean isEmpty(String str) {
if (str == null || "".equals(str.trim())) {
return true;
}
return false;
}
}
5.准备User类 用户类 javabean
image.png
package com.shsxt.model;
/**
* 用户类
* @author Lisa Li
*
*/
public class User {
private Integer userId; // 主键，用户ID
private String userName; // 用户名
private String userPwd; // 用户密码
public Integer getUserId() {
return userId;
}
public void setUserId(Integer userId) {
this.userId = userId;
}
public String getUserName() {
return userName;
}
public void setUserName(String userName) {
this.userName = userName;
}
public String getUserPwd() {
return userPwd;
}
public void setUserPwd(String userPwd) {
this.userPwd = userPwd;
}
@Override
public String toString() {
return "User [userId=" + userId + ", userName=" + userName + ", userPwd=" + userPwd + "]";
}
}
6.用户登陆服务器端
通过用户名和密码查询用户对象
* 1）、得到数据库连接
* 2）、准备[sql]{.underline}语句
* 3）、预编译[sql]{.underline}语句
* 4）、设置参数，下标从1开，按照参数的顺序设置
* 5）、执行查询，返回resultSet结果集
* 6）、判断并分析结果集，得到user对象
* 7）、关闭资源
image.png
package com.shsxt.servlet;
import java.io.IOException;
import java.io.PrintWriter;
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import com.shsxt.model.User;
import com.shsxt.util.DBUtil;
import com.shsxt.util.StringUtil;
/**
* 用户登录
*/
public class UserServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// 接收参数 （用来区分当前是什么操作）
String actionName = request.getParameter("actionName");
// actionName=form表示表单提交；actionName=ajax表示ajax提交
if ("form".equals(actionName)) {
// 表单登录
formSubmit(request, response);
} else if ("ajax".equals(actionName)) {
// ajax登录
ajaxSubmit(request, response);
}
}
/**
* ajax登录
* @param request
* @param response
* @throws IOException
*/
private void ajaxSubmit(HttpServletRequest request, HttpServletResponse response) throws IOException {
// 接收参数
String uname = request.getParameter("userName");
String upwd = request.getParameter("userPwd");
// 设置响应类型及编码
response.setContentType("text/html;charset=UTF-8");
// 得到输出流
PrintWriter out = response.getWriter();
// 非空判断
if (StringUtil.isEmpty(uname) || StringUtil.isEmpty(upwd)) {
out.write("用户名或密码不能为空！");
out.close();
return;
}
// 从数据库中查询用户对象是否存在
User user = findUserByUnameAndUpwd(uname, upwd);
// 判断用户对象是否存在
if (user == null) {
out.write("用户名称或密码不正确！");
out.close();
return;
}
// 登录成功
out.write("Success");
out.close();
}
/**
* 表单登录
* @param request
* @param response
* @throws IOException
*/
public void formSubmit(HttpServletRequest request, HttpServletResponse response) throws IOException {
// 接收参数
String uname = request.getParameter("uname");
String upwd = request.getParameter("upwd");
// 设置响应类型及编码
response.setContentType("text/html;charset=UTF-8");
// 得到输出流
PrintWriter out = response.getWriter();
// 非空判断
if (StringUtil.isEmpty(uname) || StringUtil.isEmpty(upwd)) {
out.write("<h3>用户名或密码不能为空！</h3><h4><a href='login.html'>返回登录</a></h4>");
out.close();
return;
}
// 从数据库中查询用户对象是否存在
User user = findUserByUnameAndUpwd(uname, upwd);
// 判断用户对象是否存在
if (user == null) {
out.write("<h3>用户名称或密码不正确！</h3><h4><a href='login.html'>返回登录</a></h4>");
out.close();
return;
}
// 登录成功跳转到首页
response.sendRedirect("index.html");
}
/**
* 通过用户名和密码查询用户对象
* 1、得到数据库连接
* 2、准备sql语句
* 3、预编译sql语句
* 4、设置参数，下标从1开，按照参数的顺序设置
* 5、执行查询，返回resultSet结果集
* 6、判断并分析结果集，得到user对象
* 7、关闭资源
* @param userName
* @param userPwd
* @return
*/
public User findUserByUnameAndUpwd (String userName, String userPwd) {
User user = null;
Connection connection = null;
PreparedStatement preparedStatement = null;
ResultSet resultSet = null;
try {
// 1、得到数据库连接
connection = DBUtil.getConnection();
// 2、准备sql语句
String sql = "select * from tb_user where userName = ? and userPwd = ? ";
// 3、预编译sql语句
preparedStatement = connection.prepareStatement(sql);
// 4、设置参数，下标从1开，按照参数的顺序设置
preparedStatement.setString(1, userName);
preparedStatement.setString(2, userPwd);
// 5、执行查询，返回resultSet结果集
resultSet = preparedStatement.executeQuery();
// 6、判断并分析结果集，得到user对象
/*while (resultSet.next()) {
}*/
if (resultSet.next()) { // 如果返回true，表示查询到数据；否则未查询到数据
user = new User();
user.setUserId(resultSet.getInt("userId"));
user.setUserName(resultSet.getString("userName"));
user.setUserPwd(userPwd);
}
} catch (Exception e) {
e.printStackTrace();
} finally {
// 7、关闭资源
DBUtil.close(connection, preparedStatement, resultSet);
}
return user;
}
public static void main(String[] args) {
System.out.println(new UserServlet().findUserByUnameAndUpwd("zhangsan", "123456"));
}
}
配置WEB.xml文件
image.png
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" id="WebApp_ID" version="2.5">
<display-name>loginProject</display-name>
<welcome-file-list>
<welcome-file>index.html</welcome-file>
<welcome-file>index.htm</welcome-file>
<welcome-file>index.jsp</welcome-file>
<welcome-file>default.html</welcome-file>
<welcome-file>default.htm</welcome-file>
<welcome-file>default.jsp</welcome-file>
</welcome-file-list>
<servlet>
<description></description>
<display-name>UserServlet</display-name>
<servlet-name>UserServlet</servlet-name>
<servlet-class>com.shsxt.servlet.UserServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>UserServlet</servlet-name>
<url-pattern>/userServlet</url-pattern>
</servlet-mapping>
</web-app>
7。前台页面 模拟表单登陆
image.png
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>用户登录</title>
</head>
<body>
<form action="userServlet" method="post">
姓名：<input type="text" name="uname" id="uname" /> <br/>
密码：<input type="password" name="upwd" id="upwd" /> <br/>
<input type="button" value="登录" onclick="checkForm()" />
<span id="msg" style="font-size:12px;color:red"></span>
<input type="hidden" name="actionName" value="form" />
</form>
</body>
<script type="text/javascript" src="js/jquery-3.4.1.js"></script>
<script type="text/javascript">
/*
* 验证表单
*/
function checkForm(){
// 获取用户名
var uname = $("#uname").val();
// 判断是否为空
if (uname.length < 1) {
$("#msg").html("姓名不能为空！");
return;
}
// 获取密码
var upwd = $("#upwd").val();
// 判断是否为空
if (upwd.length < 1) {
$("#msg").html("密码不能为空！");
return;
}
// 提交表单
$("form").submit();
}
</script>
</html>
登陆成功页面
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<h2>登录成功！</h2>
</body>
</html>
image.png
image.png
8。前台页面 模拟* ajax登录 异步登陆
image.png
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
姓名：<input type="text" name="uname" id="uname" /> <br/>
密码：<input type="password" name="upwd" id="upwd" /> <br/>
<input type="button" value="登录" onclick="checkForm()" />
<span id="msg" style="font-size:12px;color:red"></span>
</body>
<script type="text/javascript" src="js/jquery-3.4.1.js"></script>
<script type="text/javascript">
/*
* 验证表单
*/
function checkForm(){
// 获取用户名
var uname = $("#uname").val();
// 判断是否为空
if (uname.length < 1) {
$("#msg").html("姓名不能为空！");
return;
}
// 获取密码
var upwd = $("#upwd").val();
// 判断是否为空
if (upwd.length < 1) {
$("#msg").html("密码不能为空！");
return;
}
// 发送ajax请求
$.ajax({
type:"post",
url:"userServlet",
data:{
userName:uname,
userPwd:upwd,
actionName:"ajax"
},
success:function(result) {
if (result == "Success") {
// js跳转
window.location.href = "index.html";
} else {
$("#msg").html(result);
}
}
});
}
</script>
</html>
