核心目标:
- 连接 MySQL 数据库。
- 从后端(Java Servlet)获取数据。
- 在前端(JSP 页面)展示数据。
- 实现简单的交互(例如点击查看详情)。
步骤详解:
1. 准备数据库
假设你有一个名为 testdb 的数据库,里面有一张 users 表:
sql
CREATE TABLE users (
id INT PRIMARY KEY AUTO_INCREMENT,
name VARCHAR(50) NOT NULL,
email VARCHAR(100) NOT NULL
);
INSERT INTO users (name, email) VALUES ('张三', 'zhangsan@example.com');
INSERT INTO users (name, email) VALUES ('李四', 'lisi@example.com');
2. 创建 Java Web 项目
- 在 IDEA 中,选择
File->New->Project...。 - 选择
Java Enterprise。 - 确保勾选
Web Application。 - 设置项目名称和位置,点击
Finish。
3. 添加 MySQL JDBC 驱动
- 下载 MySQL Connector/J (JDBC 驱动) JAR 文件。
- 将 JAR 文件复制到项目的
WebContent/WEB-INF/lib目录下。IDEA 通常会自动将其添加到项目依赖中。
4. 配置数据库连接信息(建议使用属性文件)
创建一个 db.properties 文件放在 src 目录下:
properties
db.driver=com.mysql.cj.jdbc.Driver
db.url=jdbc:mysql://localhost:3306/testdb?useSSL=false&serverTimezone=UTC&characterEncoding=UTF-8
db.username=your_username
db.password=your_password
- 替换
your_username和your_password为你的数据库用户名和密码。 characterEncoding=UTF-8确保正确处理中文。
5. 创建数据库连接工具类 (DBUtil.java)
在 src 下创建一个包(如 com.example.util),然后创建 DBUtil.java:
java
package com.example.util;
import java.io.IOException;
import java.io.InputStream;
import java.sql.*;
import java.util.Properties;
public class DBUtil {
private static String driver;
private static String url;
private static String username;
private static String password;
static {
try {
// 加载 db.properties
InputStream in = DBUtil.class.getClassLoader().getResourceAsStream("db.properties");
Properties prop = new Properties();
prop.load(in);
driver = prop.getProperty("db.driver");
url = prop.getProperty("db.url");
username = prop.getProperty("db.username");
password = prop.getProperty("db.password");
// 加载驱动类
Class.forName(driver);
} catch (IOException | ClassNotFoundException e) {
e.printStackTrace();
throw new ExceptionInInitializerError("初始化数据库连接失败");
}
}
// 获取数据库连接
public static Connection getConnection() throws SQLException {
return DriverManager.getConnection(url, username, password);
}
// 释放资源
public static void close(Connection conn, Statement stmt, ResultSet rs) {
try {
if (rs != null) rs.close();
if (stmt != null) stmt.close();
if (conn != null) conn.close();
} catch (SQLException e) {
e.printStackTrace();
}
}
}
6. 创建数据模型 (User.java)
在 src 下创建一个包(如 com.example.model),然后创建 User.java:
java
package com.example.model;
public class User {
private int id;
private String name;
private String email;
// 构造方法
public User() {}
public User(int id, String name, String email) {
this.id = id;
this.name = name;
this.email = email;
}
// Getter 和 Setter 方法
public int getId() { return id; }
public void setId(int id) { this.id = id; }
public String getName() { return name; }
public void setName(String name) { this.name = name; }
public String getEmail() { return email; }
public void setEmail(String email) { this.email = email; }
}
7. 创建数据访问对象 (UserDAO.java)
在 src 下创建一个包(如 com.example.dao),然后创建 UserDAO.java:
java
package com.example.dao;
import com.example.model.User;
import com.example.util.DBUtil;
import java.sql.*;
import java.util.ArrayList;
import java.util.List;
public class UserDAO {
public List<User> getAllUsers() {
List<User> userList = new ArrayList<>();
Connection conn = null;
PreparedStatement stmt = null;
ResultSet rs = null;
try {
conn = DBUtil.getConnection();
String sql = "SELECT id, name, email FROM users";
stmt = conn.prepareStatement(sql);
rs = stmt.executeQuery();
while (rs.next()) {
User user = new User();
user.setId(rs.getInt("id"));
user.setName(rs.getString("name"));
user.setEmail(rs.getString("email"));
userList.add(user);
}
} catch (SQLException e) {
e.printStackTrace();
} finally {
DBUtil.close(conn, stmt, rs); // 使用工具类关闭资源
}
return userList;
}
// 可以根据需要添加其他方法,如 getUserById, addUser, updateUser, deleteUser
}
8. 创建 Servlet 处理请求 (UserServlet.java)
在 src 下创建一个包(如 com.example.servlet),然后创建 UserServlet.java。这里处理获取所有用户的请求:
java
package com.example.servlet;
import com.example.dao.UserDAO;
import com.example.model.User;
import javax.servlet.*;
import javax.servlet.http.*;
import javax.servlet.annotation.*;
import java.io.IOException;
import java.util.List;
@WebServlet(name = "UserServlet", urlPatterns = "/user")
public class UserServlet extends HttpServlet {
@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// 1. 获取数据
UserDAO userDAO = new UserDAO();
List<User> userList = userDAO.getAllUsers();
// 2. 将数据存储到 request 属性中,传递给 JSP
request.setAttribute("userList", userList);
// 3. 转发请求到展示数据的 JSP 页面
RequestDispatcher dispatcher = request.getRequestDispatcher("/userList.jsp");
dispatcher.forward(request, response);
}
@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doGet(request, response); // 简单起见,POST 也调用 doGet
}
}
9. 创建展示数据的 JSP 页面 (userList.jsp)
在 WebContent 目录下创建 userList.jsp:
jsp
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
<title>用户列表</title>
</head>
<body>
<h2>用户列表</h2>
<table border="1">
<tr>
<th>ID</th>
<th>姓名</th>
<th>邮箱</th>
<th>操作</th>
</tr>
<%-- 使用 JSTL 的 forEach 遍历 userList --%>
<c:forEach var="user" items="${userList}">
<tr>
<td>${user.id}</td>
<td>${user.name}</td>
<td>${user.email}</td>
<td>
<%-- 构建一个链接,传递用户ID参数 --%>
<a href="userDetail.jsp?id=${user.id}">查看详情</a>
</td>
</tr>
</c:forEach>
</table>
</body>
</html>
10. (可选) 创建查看用户详情的 JSP 和 Servlet
-
Servlet (
UserDetailServlet.java) :javapackage com.example.servlet; import com.example.dao.UserDAO; import com.example.model.User; import javax.servlet.*; import javax.servlet.http.*; import javax.servlet.annotation.*; import java.io.IOException; @WebServlet(name = "UserDetailServlet", urlPatterns = "/userDetail") public class UserDetailServlet extends HttpServlet { @Override protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // 1. 获取请求参数 id String idStr = request.getParameter("id"); if (idStr == null || idStr.isEmpty()) { // 处理错误,例如重定向回列表页 response.sendRedirect("user"); return; } int userId = Integer.parseInt(idStr); // 2. 根据 id 查询用户 UserDAO userDAO = new UserDAO(); User user = userDAO.getUserById(userId); // 需要在 UserDAO 中实现 getUserById 方法 // 3. 将用户对象存储到 request 属性中 request.setAttribute("user", user); // 4. 转发到详情页 JSP RequestDispatcher dispatcher = request.getRequestDispatcher("/userDetail.jsp"); dispatcher.forward(request, response); } } -
JSP (
userDetail.jsp) :jsp<%@ page contentType="text/html;charset=UTF-8" language="java" %> <html> <head> <title>用户详情</title> </head> <body> <h2>用户详情</h2> <p>ID: ${user.id}</p> <p>姓名: ${user.name}</p> <p>邮箱: ${user.email}</p> <a href="user">返回列表</a> <%-- 假设列表页由 UserServlet 处理 --%> </body> </html>
11. 配置部署和运行
- 配置你的 Web 服务器(如 Tomcat)在 IDEA 中。
- 将项目部署到服务器上。
- 启动服务器。
- 在浏览器中访问:
http://localhost:8080/YourProjectName/user(将YourProjectName替换为你的实际项目上下文路径)。
关键点总结:
- 分层结构: Model (User), DAO (UserDAO), Controller (Servlet), View (JSP)。
- 数据库连接: 使用
DBUtil工具类管理连接,使用属性文件存储配置信息。 - 数据传输: Servlet 使用
request.setAttribute(...)将数据传递给 JSP。 - 数据展示: JSP 使用 JSTL (
<c:forEach>) 和 EL (Expression Language${...}) 来循环显示数据。 - 前后端交互: JSP 页面上的链接 (
<a href="userDetail.jsp?id=${user.id}">) 将参数传递给 Servlet,Servlet 根据参数查询数据并渲染新的页面。
调试建议:
- 确保数据库驱动 JAR 在
WEB-INF/lib下。 - 仔细检查
db.properties中的连接信息是否正确。 - 在 Servlet 和 DAO 中添加必要的日志输出 (
System.out.println或使用日志框架) 以跟踪执行流程和数据。 - 注意浏览器控制台和服务器控制台的错误信息。
- 对于中文乱码问题:
- 数据库连接 URL 添加
characterEncoding=UTF-8。 - JSP 页面设置
page指令的charset=UTF-8。 - Servlet 处理请求和响应时考虑字符编码(示例中
doGet/doPost未显式设置,对于简单场景可能够用,复杂时需设置request.setCharacterEncoding("UTF-8")和response.setCharacterEncoding("UTF-8"))。
- 数据库连接 URL 添加
通过以上步骤,你应该能够在 IDEA 环境中实现 MySQL 数据在 JSP 页面的基本展示和交互功能。