JSP+Servlet实现前端展现数据库中的数据
学了很长时间的JSP和Servlet，虽然还是没有完全的理解其中的原理，但是总会一点点的技术，这次，就来实现把数据库中的数据在前端展示出来。
一、需求
实现数据库中的数据展现在前端界面
二、设计
技术选型：Servlet JSP Mysql JDBC Druid BeanUtil Tomcat
数据库设计：这是我第一次做这个小小的案例，所以就设计一张物品表
id name value 三个字段，id是主键，这张的表中的值事先都是添加好的，直接使用即可
具体的设计思路如下：
画了一小会的思路图片，虽然不好看，但是思路很清晰，接着就是根据设计思路，写代码啦！
三、开发
环境搭建：创建数据库环境，创建项目导入jar包
编码如下：
导入的jar包：
文件的目录结构：
这样一切都准备就绪了，那我们从哪开始写代码呢？
目前我是从dao层开始，不知道你们从哪开始？
首先写dao层：
在写dao层之前，应该先写连接数据库的工具类和一些配置文件：
DruidUtil类;
package util;
import com.alibaba.druid.pool.DruidDataSourceFactory;
import javax.sql.DataSource;
import java.io.IOException;
import java.io.InputStream;
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.Properties;
/**
* druid数据库连接池的工具类
*/
public class DruidUtil {
private static DataSource ds;
static {
//加载配置文件和建立连接池
try {
Properties pro = new Properties();
InputStream resourceAsStream = DruidUtil.class.getClassLoader().getResourceAsStream("Druid.properties");
pro.load(resourceAsStream);
ds = DruidDataSourceFactory.createDataSource(pro);
} catch (IOException e) {
e.printStackTrace();
} catch (Exception e) {
e.printStackTrace();
}
}
/**
* 获取数据库连接池
* @return
*/
public static DataSource getDataSource(){
return ds;
}
/**
* 获取连接池中的一个连接
* @return
* @throws SQLException
*/
public Connection getconnection() throws SQLException {
return ds.getConnection();
}
/**
* 关闭数据库的资源 三个对象都存在时
* @param conn
* @param res
* @param pstmt
*/
public static void close(Connection conn, ResultSet res, PreparedStatement pstmt){
if (conn!=null){
try {
conn.close();
} catch (SQLException e) {
e.printStackTrace();
}
}
if (res!=null){
try {
res.close();
} catch (SQLException e) {
e.printStackTrace();
}
}
if (pstmt!=null){
try {
pstmt.close();
} catch (SQLException e) {
e.printStackTrace();
}
}
}
/**
* 关闭数据库的连接（只存在Connection和PreparedStatement对象时）
* @param conn
* @param pstmt
*/
public void close(Connection conn,PreparedStatement pstmt){
if (conn!=null){
try {
conn.close();
} catch (SQLException e) {
e.printStackTrace();
}
}
if (pstmt!=null){
try {
pstmt.close();
} catch (SQLException e) {
e.printStackTrace();
}
}
}
}
Druid.properties
driverClassName = com.mysql.cj.jdbc.Driver
url=jdbc:mysql:///student?serverTimezone=GMT&useSSL=false
username=root
password=yanzhiguo140710
#初始化连接数量#
initialSize = 5
#最大连接数量
maxACtive = 10
#等待时间 3秒
maxWait = 3000
写完之后，就可以写dao层的代码了：
首先写UserDao接口，然后写UserDaoImpl的实现类
UesrDao接口：
package dao;
import domain.Users;
import java.util.List;
public interface UsersDao {
public List<Users> findAll();
}
UserDaoImpl实现类：
package dao.impl;
import dao.UsersDao;
import domain.Users;
import org.springframework.jdbc.core.BeanPropertyRowMapper;
import org.springframework.jdbc.core.JdbcTemplate;
import util.DruidUtil;
import java.util.List;
/**
* dao层 操纵数据库
* 从数据库中拿出数据 传给servive层
*/
public class UsersDaoImpl implements UsersDao {
private JdbcTemplate template = new JdbcTemplate(DruidUtil.getDataSource());
@Override
public List<Users> findAll() {
String sql = "select * from goods";
List<Users> query = template.query(sql, new BeanPropertyRowMapper<Users>(Users.class));
return query;
}
}
这样就写完了dao层的代码
对了没还有一个重要的Javabean还没写：
package domain;
/**
* 用户类 把数据用类对象展示
* 相当于JavaBean
*/
public class Users {
Integer id;
String name;
Integer value;
public Users(Integer id, String name, Integer value) {
this.id = id;
this.name = name;
this.value = value;
}
public Users(){
}
public Integer getId() {
return id;
}
public void setId(Integer id) {
this.id = id;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public Integer getValue() {
return value;
}
public void setValue(Integer value) {
this.value = value;
}
@Override
public String toString() {
return "Users{" +
"id=" + id +
", name='" + name + '\'' +
", value=" + value +
'}';
}
}
Service层
根据设计思路，先写UserService接口：
package service;
import domain.Users;
import java.util.List;
public interface UsersService {
public List<Users> findAll();
}
USerServiceImpl实现类：
package service.impl;
import dao.UsersDao;
import dao.impl.UsersDaoImpl;
import domain.Users;
import service.UsersService;
import java.util.List;
/**
* 调用dao层中Usersdao中方法 获得数据库中的数据
*/
public class UsersServiceImpl implements UsersService {
@Override
public List<Users> findAll() {
UsersDaoImpl dao = new UsersDaoImpl();
List<Users> users_list = dao.findAll();
return users_list;
}
}
这样Service层就写完了
view层：
这主要是处理请求的代码：
package web.servlet;
import domain.Users;
import service.UsersService;
import service.impl.UsersServiceImpl;
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.util.List;
@WebServlet("/userServletList")
public class UserServletList extends HttpServlet {
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//用service层来完成数据库的查询
UsersService usersservice = new UsersServiceImpl();
List<Users> list = usersservice.findAll();
//将数据存在数据域中
System.out.println(list);
request.setAttribute("list",list);
//转发到list.jsp中
request.getRequestDispatcher("/list.jsp").forward(request,response);
}
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
this.doPost(request,response);
}
}
这样三层就基本写完了，剩下的就是前端页面的展示，我在写的过程中，利用了bootstrap框架没这样，这样写代码简单。
index.jsp
<%--
Created by IntelliJ IDEA.
User: yzg
Date: 2019/4/6
Time: 13:15
To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>志国出品</title>
<link rel="stylesheet" href="css/bootstrap.min.css">
<!-- 包括所有已编译的插件 -->
<script src="js/bootstrap.min.js"></script>
</head>
<body>
<div align="center">
<a href="${pageContext.request.contextPath}/userServletList">
点击查看信息
</a>
</div>
</body>
</html>
list.jsp:
<%--
Created by IntelliJ IDEA.
User: yzg
Date: 2019/4/6
Time: 13:41
To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jstl/core_rt"%>
<html>
<head>
<title>Title</title>
<title>物品列表</title>
<link rel="stylesheet" href="css/bootstrap.min.css">
<!-- 包括所有已编译的插件 -->
<script src="js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<h3 align="center">物品信息列表</h3>
<table class="table table-bordered table-hover">
<tr class="success">
<th>编号</th>
<th>名称</th>
<th>价格</th>
</tr>
<c:forEach var="li" items="${list}" varStatus="s">
<tr>
<td>${s.count}</td>
<td>${li.name}</td>
<td>${li.value}</td>
</tr>
</c:forEach>
</table>
</div>
</body>
</html>
这样就基本写完了，剩下的时间就是努力找Bug了
总结
1、Java中导入包的时候将lib文件夹变成Add as library
2、导入jar包，要注意千万别导错了！！！！
3、要熟悉jsp中的对象，以及他们的用法
4、使用EL和JSTL时，要注意使用的是否正确，别忘了$
5、写前端代码时，可以参考bootstrap文档
6、dao层的代码一定要细心，否数据都拿不出来
7、关键时Servlet的书写，这部分最难理解，还需加强
8、花了1个小时写代码，找Bug花了好几个小时，啊啊啊啊啊啊啊啊，痛苦啊，不过最终还是写出来了，还是很高兴的。
最后，希望每个人都能在这条道路上继续坚持下去，加油！！！