AI 助理
备案控制台
开发者社区 数据库 文章 正文

Javaweb项目案例：一个简单的用户管理系统实现

2022-12-08 602
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： 1.项目背景我们来设计一个简单的用户管理系统，具有查看用户，添加用户，删除用户，更新用户的所有功能，并能支持分页显示，以及通过关键词模糊查询的🎈本项目采用Druid数据库连接池注意：JDBC和DAO部分本文不予演示，请自行完成此部分代码的编写🛍️



1.项目背景


我们来设计一个简单的用户管理系统，具有查看用户，添加用户，删除用户，更新用户的所有功能，并能支持分页显示，以及通过关键词模糊查询的🎈


本项目采用Druid数据库连接池


注意：JDBC和DAO部分本文不予演示，请自行完成此部分代码的编写🛍️


2.展示用户列表


模板页面，showuser.html


<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>用户列表</title>
</head>
<style>
    table {
        width: 80%;
        border-color: white;
    }
    table tr {
        line-height: 30px;
        border-color: white;
    }
    table tr:FIRST-CHILD {
        background: #f2f2f2;
    }
    table tr:nth-child(even) {
        background: #d5eeeb;
    }
</style>
<script type="text/javascript">
    /**
     * 删除用户
     * @param uid 用户ID信息
     */
    function delUser(uid) {
        if (confirm('是否确认删除？')) {
            window.location.href = 'del.do?id=' + uid;
        }
    }
    /**
     * 获取某一页的用户数据
     * @param pageNo 页码
     */
    function page(pageNo) {
        if (pageNo > 0) {
            window.location.href = 'showuser?pageNo=' + pageNo;
        }
    }
</script>
<body>
<form action="showuser" method="post">
    <input type="hidden" name="oper" value="search">
    查找关键字：<input type="text" name="keyword" th:value="${session.keyword}">
    <button type="submit">提 交</button>
</form>
<table>
    <tbody>
    <tr align="center">
        <td>用户名</td>
        <td>学校</td>
        <td>删除内容</td>
        <td>添加内容</td>
    </tr>
    <tr align="center" th:if="${#lists.isEmpty(session.userList)}">
        <td>没有啦</td>
        <td>没有啦</td>
        <td>没有啦</td>
        <td>没有啦</td>
    </tr>
    <tr align="center" th:unless="${#lists.isEmpty(session.userList)}" th:each="user : ${session.userList}">
        <td><a th:text="${user.username}" th:href="@{/edit.do(uid=${user.id})}"></a></td>
        <td><a th:text="${user.school}" th:href="@{/edit.do(uid=${user.id})}"></a></td>
        <td><a th:onclick="|delUser(${user.id})|">删除</a></td>
        <td><a th:href="@{/add.html}">添加</a></td>
    </tr>
    </tbody>
</table>
<!--分页-->
<div>
    <input type="button" value="首 页" th:onclick="|page(1)|">
    <input type="button" value="上一页" th:onclick="|page(${session.pageNo - 1})|">
    <input type="button" value="下一页" th:onclick="|page(${session.pageNo + 1})|">
    <input type="button" value="尾 页" th:onclick="|page(${session.totalPageNo})|">
</div>
</body>
</html>


ShowUserServlet：


import jdbc.dao.UserDAO;
import jdbc.domain.User;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import java.io.IOException;
import java.util.List;
/**
 * 使用Thymeleaf渲染页面展示user列表
 */
@WebServlet("/showuser")
public class ShowUserServlet extends ViewBaseServlet {
    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        doGet(req, resp);
    }
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        req.setCharacterEncoding("UTF-8");
        HttpSession session = req.getSession();
        int pageNo = 1;
        // 如果oper为null，说明是通过表单查询按钮点击过来的
        // 如果oper是null，说明不是通过表单查询按钮点击过来的
        String oper = req.getParameter("oper");
        String keyword = null;
        if ("search".equals(oper)) {
            pageNo = 1;
            keyword = req.getParameter("keyword");
            if (keyword == null) {
                keyword = "";
            }
            session.setAttribute("keyword", keyword);
        } else {
            String pageNoStr = req.getParameter("pageNo");
            if (pageNoStr != null) {
                pageNo = Integer.parseInt(pageNoStr);
            }
            Object keywordObj = session.getAttribute("keyword");
            if (keywordObj != null) {
                keyword = (String) keywordObj;
            } else {
                keyword = "";
            }
        }
        // 将页码保存到session作用域
        session.setAttribute("pageNo", pageNo);
        UserDAO userDAO = new UserDAO();
        List<User> userList = userDAO.getUserListByPageAndKeyword(pageNo, keyword);
        // 将userList放到session 作用域
        session.setAttribute("userList", userList);
        // 得到用户总数
        long userCount = userDAO.getUserCount(keyword);
        // 得到页数
        long totalPageNo = userCount / 5 + 1;
        session.setAttribute("totalPageNo", totalPageNo);
        // 注意：物理视图名称 = view-prefix + view-suffix
        // 这里结合xml文件拼接也就是/showuser.html
        super.processTemplate("showuser", req, resp);
    }
}


3.添加用户


add.html


<!-- user表添加页面 -->
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <title>用户添加页面</title>
</head>
<style>
  * {
    margin: 0;
    padding: 0;
  }
  /*渐变背景样式*/
  body {
    height: 100vh;
    width: 100%;
    overflow: hidden;
    background-image: linear-gradient(125deg, #F44336, #E91E63, #9C27B0, #3F51B5, #2196F3);
    background-size: 400%;
    font-family: "montserrat";
    animation: bganimation 15s infinite;
  }
  @keyframes bganimation {
    0% {
      background-position: 0% 50%;
    }
    50% {
      background-position: 100% 50%;
    }
    100% {
      background-position: 0% 50%;
    }
  }
  /*表单样式*/
  .form {
    width: 85%;
    max-width: 600px;
    /* max-height:700px;
    */
    background-color: rgba(255, 255, 255, .05);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 40px;
    border-radius: 10px;
    box-shadow: 0 0 5px #000;
    text-align: center;
    font-family: "微软雅黑";
    color: #fff;
  }
  /*表单标题样式*/
  .form h1 {
    margin-top: 0;
    font-weight: 200;
  }
  .form .txtb {
    border: 1px solid #aaa;
    margin: 8px 0;
    padding: 12px 18px;
    border-radius: 10px;
  }
  .txtb label {
    display: block;
    text-align: left;
    color: #fff;
    font-size: 14px;
  }
  /*输入框样式*/
  .txtb input, .txtb textarea {
    width: 100%;
    background: none;
    border: none;
    outline: none;
    margin-top: 6px;
    font-size: 18px;
    color: #fff;
  }
  /*备注框样式*/
  .txtb textarea {
    max-height: 300px;
  }
  /*提交按钮样式*/
  .btn {
    display: block;
    /* background-color:rgba(156,39,176,.5);
    */
    padding: 14px 0;
    color: #fff;
    cursor: pointer;
    margin-top: 8px;
    width: 100%;
    border: 1px solid #aaa;
    border-radius: 10px;
  }
</style>
<body>
<div class="form">
  <form action="add.do" method="post">
    <h1>用户信息添加</h1>
    <div class="txtb">
      <label for="">用户名:</label>
      <input type="text" placeholder="请输入用户名" name="username"
             th:value="${userInfo.username}"></div>
    <div class="txtb">
      <label for="">密码:</label>
      <input type="text" placeholder="请输入密码" name="password"
             th:value="${userInfo.password}"></div>
    <div class="txtb">
      <label for="">学校:</label>
      <input type="text" placeholder="请输入学校" name="school"
             th:value="${userInfo.school}">
    </div>
    <div class="txtb">
      <label for="">备注:</label>
      <textarea name="shit" id=""></textarea>
    </div>
    <input type="submit" value="提 交" class="btn" style="color: #E91E63">
  </form>
</div>
</body>
</html>


AddUserServlet：


import jdbc.dao.UserDAO;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
/**
 * 向User表中添加数据
 */
@WebServlet("/add.do")
public class AddUserServlet extends ViewBaseServlet {
    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        req.setCharacterEncoding("UTF-8");
        String username = req.getParameter("username");
        String password = req.getParameter("password");
        String school = req.getParameter("school");
        UserDAO userDAO = new UserDAO();
        userDAO.addUserNoId(username, password, school);
        resp.sendRedirect("showuser");
    }
}


4.删除用户


DelServlet：


import jdbc.dao.UserDAO;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
/**
 * 根据ID删除用户
 */
@WebServlet("/del.do")
public class DelServlet extends ViewBaseServlet {
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        int id = Integer.parseInt(req.getParameter("id"));
        UserDAO userDAO = new UserDAO();
        userDAO.delUser(id);
        resp.sendRedirect("showuser");
    }
}


5.修改用户


edit.html：


<!-- user表编辑页面 -->
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>用户编辑页面</title>
</head>
<style>
    * {
        margin: 0;
        padding: 0;
    }
    /*渐变背景样式*/
    body {
        height: 100vh;
        width: 100%;
        overflow: hidden;
        background-image: linear-gradient(125deg, #F44336, #E91E63, #9C27B0, #3F51B5, #2196F3);
        background-size: 400%;
        font-family: "montserrat";
        animation: bganimation 15s infinite;
    }
    @keyframes bganimation {
        0% {
            background-position: 0% 50%;
        }
        50% {
            background-position: 100% 50%;
        }
        100% {
            background-position: 0% 50%;
        }
    }
    /*表单样式*/
    .form {
        width: 85%;
        max-width: 600px;
        /* max-height:700px;
        */
        background-color: rgba(255, 255, 255, .05);
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        padding: 40px;
        border-radius: 10px;
        box-shadow: 0 0 5px #000;
        text-align: center;
        font-family: "微软雅黑";
        color: #fff;
    }
    /*表单标题样式*/
    .form h1 {
        margin-top: 0;
        font-weight: 200;
    }
    .form .txtb {
        border: 1px solid #aaa;
        margin: 8px 0;
        padding: 12px 18px;
        border-radius: 10px;
    }
    .txtb label {
        display: block;
        text-align: left;
        color: #fff;
        font-size: 14px;
    }
    /*输入框样式*/
    .txtb input, .txtb textarea {
        width: 100%;
        background: none;
        border: none;
        outline: none;
        margin-top: 6px;
        font-size: 18px;
        color: #fff;
    }
    /*备注框样式*/
    .txtb textarea {
        max-height: 300px;
    }
    /*提交按钮样式*/
    .btn {
        display: block;
        /* background-color:rgba(156,39,176,.5);
        */
        padding: 14px 0;
        color: #fff;
        cursor: pointer;
        margin-top: 8px;
        width: 100%;
        border: 1px solid #aaa;
        border-radius: 10px;
    }
</style>
<body>
<div class="form">
    <form th:action="@{/update.do}" method="post">
        <h1>用户信息修改</h1>
        <!--隐藏传递用户ID信息，使用隐藏域-->
        <input type="hidden" name="id" th:value="${userInfo.id}">
        <div class="txtb">
            <label for="">用户名:</label>
            <input type="text" placeholder="请输入用户名" name="username"
                   th:value="${userInfo.username}"></div>
        <div class="txtb">
            <label for="">密码:</label>
            <input type="text" placeholder="请输入密码" name="password"
                   th:value="${userInfo.password}"></div>
        <div class="txtb">
            <label for="">学校:</label>
            <input type="text" placeholder="请输入学校" name="school"
                   th:value="${userInfo.school}">
        </div>
        <div class="txtb">
            <label for="">备注:</label>
            <textarea name="shit" id=""></textarea>
        </div>
        <input type="submit" value="提 交" class="btn" style="color: #E91E63">
    </form>
</div>
</body>
</html>


EditServlet：


import jdbc.dao.UserDAO;
import jdbc.domain.User;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
/**
 * 编辑user表中的数据
 */
@WebServlet("/edit.do")
public class EditServlet extends ViewBaseServlet {
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        String uidStr = req.getParameter("uid");
        if (uidStr != null && !"".equals(uidStr)) {
            int uid = Integer.parseInt(uidStr);
            UserDAO userDAO = new UserDAO();
            User user = userDAO.getUserById(uid);
            // 保存到request作用域
            req.setAttribute("userInfo", user);
            super.processTemplate("edit", req, resp);
        }
    }
}


6.界面展示


展示用户列表：（此页面支持分页，模糊查询，修改，删除，添加）🤤



用户信息修改：（用户信息添加类似）🍔


文章标签：
Java
druid
数据库
数据库连接
关键词：
javaweb系统Java
javaweb Java
案例Java
案例系统Java
管理系统Java
dahezhiquan
目录
相关文章
BigFour
|
9天前
|
设计模式 消息中间件 传感器
Java 设计模式之观察者模式：构建松耦合的事件响应系统
观察者模式是Java中常用的行为型设计模式，用于构建松耦合的事件响应系统。当一个对象状态改变时，所有依赖它的观察者将自动收到通知并更新。该模式通过抽象耦合实现发布-订阅机制，广泛应用于GUI事件处理、消息通知、数据监控等场景，具有良好的可扩展性和维护性。
BigFour
104 8
源码世界
|
19天前
|
移动开发 监控 小程序
java家政平台源码，家政上门清洁系统源码，数据多端互通，可直接搭建使用
一款基于Java+SpringBoot+Vue+UniApp开发的家政上门系统，支持小程序、APP、H5、公众号多端互通。涵盖用户端、技工端与管理后台，支持多城市、服务分类、在线预约、微信支付、抢单派单、技能认证、钱包提现等功能，源码开源，可直接部署使用。
源码世界
109 23
蓝易云
|
21天前
|
安全 前端开发 Java
使用Java编写UDP协议的简易群聊系统
通过这个基础框架，你可以进一步增加更多的功能，例如用户认证、消息格式化、更复杂的客户端界面等，来丰富你的群聊系统。
蓝易云
154 11
JJLIN距离
|
23天前
|
机器学习/深度学习 人工智能 自然语言处理
Java与生成式AI：构建内容生成与创意辅助系统
生成式AI正在重塑内容创作、软件开发和创意设计的方式。本文深入探讨如何在Java生态中构建支持文本、图像、代码等多种生成任务的创意辅助系统。我们将完整展示集成大型生成模型（如GPT、Stable Diffusion）、处理生成任务队列、优化生成结果以及构建企业级生成式AI应用的全流程，为Java开发者提供构建下一代创意辅助系统的完整技术方案。
JJLIN距离
105 10
JJLIN距离
|
27天前
|
人工智能 监控 Java
Java与AI智能体：构建自主决策与工具调用的智能系统
随着AI智能体技术的快速发展，构建能够自主理解任务、制定计划并执行复杂操作的智能系统已成为新的技术前沿。本文深入探讨如何在Java生态中构建具备工具调用、记忆管理和自主决策能力的AI智能体系统。我们将完整展示从智能体架构设计、工具生态系统、记忆机制到多智能体协作的全流程，为Java开发者提供构建下一代自主智能系统的完整技术方案。
JJLIN距离
232 4
JJLIN距离
|
27天前
|
机器学习/深度学习 分布式计算 Java
Java与图神经网络：构建企业级知识图谱与智能推理系统
图神经网络（GNN）作为处理非欧几里得数据的前沿技术，正成为企业知识管理和智能推理的核心引擎。本文深入探讨如何在Java生态中构建基于GNN的知识图谱系统，涵盖从图数据建模、GNN模型集成、分布式图计算到实时推理的全流程。通过具体的代码实现和架构设计，展示如何将先进的图神经网络技术融入传统Java企业应用，为构建下一代智能决策系统提供完整解决方案。
JJLIN距离
211 0
计算机程序设计Y2013070224
|
2月前
|
JavaScript Java 大数据
基于JavaWeb的销售管理系统设计系统
本系统基于Java、MySQL、Spring Boot与Vue.js技术，构建高效、可扩展的销售管理平台，实现客户、订单、数据可视化等全流程自动化管理，提升企业运营效率与决策能力。
计算机程序设计Y2013070224
269 128
南瓜佬
|
2月前
|
IDE 安全 Java
Lombok 在企业级 Java 项目中的隐性成本：便利背后的取舍之道
Lombok虽能简化Java代码，但其“魔法”特性易破坏封装、影响可维护性，隐藏调试难题，且与JPA等框架存在兼容风险。企业级项目应优先考虑IDE生成、Java Records或MapStruct等更透明、稳健的替代方案，平衡开发效率与系统长期稳定性。
南瓜佬
144 1
游客4v3gpgavlizks
|
2月前
|
存储 小程序 Java
热门小程序源码合集：微信抖音小程序源码支持PHP/Java/uni-app完整项目实践指南
小程序已成为企业获客与开发者创业的重要载体。本文详解PHP、Java、uni-app三大技术栈在电商、工具、服务类小程序中的源码应用，提供从开发到部署的全流程指南，并分享选型避坑与商业化落地策略，助力开发者高效构建稳定可扩展项目。
游客4v3gpgavlizks
460 0
啦啦啦191
|
2月前
|
安全 Java API
Java Web 在线商城项目最新技术实操指南帮助开发者高效完成商城项目开发
本项目基于Spring Boot 3.2与Vue 3构建现代化在线商城，涵盖技术选型、核心功能实现、安全控制与容器化部署，助开发者掌握最新Java Web全栈开发实践。
啦啦啦191
277 1

热门文章

最新文章

  • 1
    百宝箱开放平台 ✖️ Java SDK
  • 2
    JUC系列之《CompletableFuture：Java异步编程的终极武器》
  • 3
    告别空指针噩梦：Optional让Java代码更优雅
  • 4
    Java异常处理：程序世界的“交通规则
  • 5
    JUC系列之《深入理解AQS：Java并发锁的基石与灵魂 》
  • 6
    【深入浅出】揭秘Java内存模型（JMM）：并发编程的基石
  • 7
    《深入理解Spring》：现代Java开发的核心框架
  • 8
    Java与AI智能体：构建自主决策与工具调用的智能系统
  • 9
    Java 简单教程
  • 10
    Java与多模态AI：构建支持文本、图像和音频的智能应用
  • 1
    Java中的break语句详解与应用
    447
  • 2
    Java中的continue语句深入解析
    309
  • 3
    Java中的do-while循环语句详解
    519
  • 4
    深入解析Java中的foreach循环语句
    184
  • 5
    Java中的for循环语句深入解析
    318
  • 6
    深入理解Java中的instanceof运算符
    587
  • 7
    Java中的if选择语句详解
    206
  • 8
    Java中的return语句深入解析
    750
  • 9
    Java中的while循环语句详解
    684
  • 10
    Java中的标号（Labels）与标签语句（Labeled Statements）深入解析
    654

    • 相关课程

    更多
  • Java面试疑难点解析 - 面试技巧及语言基础
  • Java面试疑难点解析 - Java Web开发
  • Java面试疑难点解析 - 系统架构及项目设计
  • Java编程入门
  • Java面向对象编程
  • Java高级编程

    • 相关电子书

    更多
  • Spring Cloud Alibaba - 重新定义 Java Cloud-Native
  • The Reactive Cloud Native Arch
  • JAVA开发手册1.5.0
    • 下一篇
    一文了解：阿里云对象存储OSS是什么？