本章通过名片管理系统的设计与实现，讲述如何使用SSM框架来实现一个Web应用。通过本章的学习，掌握SSM框架应用开发的流程、方法以及技术

01、系统设计

1●系统功能需求

名片管理系统是针对注册用户使用的系统。系统提供的功能如下：

1．非注册用户可以注册为注册用户。

2．成功注册的用户，可以登录系统。

3．成功登录的用户，可以添加、修改、删除以及浏览自己客户的名片信息。

4．成功登录的用户，可以修改密码

2●系统模块划分

用户登录成功后，进入管理主页面（main.jsp）可以对自己的客户名片进行管理。系统模块划分，如图4.1所示。

■ 图4.1 名片管理系统

02、数据库设计

系统采用加载纯Java数据库驱动程序的方式连接MySQL5.x数据库。在MySQL5.x的数据库ch4中，共创建两张与系统相关的数据表：usertable和cardtable。

1●数据库概念结构设计

根据系统设计与分析，可以设计出如下数据结构：

1．用户

包括ID、用户名以及密码，注册用户名唯一。

2．名片

包括ID、名称、电话、邮箱、单位、职务、地址、Logo以及所属用户。其中，ID唯一，“所属用户”与“1．用户”的用户ID关联。

根据以上数据结构，结合数据库设计特点，可画出如图4.2所示的数据库概念结构图。

■ 图4.2 数据库概念结构图

其中，ID为正整数，值是从1开始递增的序列。

2●数据库逻辑结构设计

将数据库概念结构图转换为MySQL数据库所支持的实际数据模型，即数据库的逻辑结构。

用户信息表（usertable）的设计，如表4.1所示。

■ 表4.1 用户信息表

名片信息表（cardtable）的设计，如表4.2所示。

■ 表4.2 名片信息表

03、系统管理

1●JSP页面管理

为方便管理，在/WebContent/static目录下存放与系统相关的静态资源，如BootStrap相关的CSS与JS；在/WEB-INF/jsp目录下存放与系统相关的JSP页面。

04、名片管理

1●Controller实现

在本系统中，与名片管理相关的功能包括添加、修改、删除、查询等，由控制器类CardController负责处理。由系统功能需求可知，用户必须成功登录才能管理自己的名片，所以，CardController处理添加、修改、删除、查询名片等功能前，需要进行登录权限验证。在CardController中，使用@ModelAttribute注解的方法进行登录权限验证。

2●Service实现

3●Dao实现

Dao层是数据访问层，即@Repository注解的数据操作接口（接口中的方法与SQL映射文件中元素的id对应），与名片管理相关的数据访问层为CardMapper。

4●SQL映射文件

SQL映射文件的namespace属性与数据操作接口对应。与名片管理功能相关的SQL映射文件是CardMapper.xml（位于dao包中）

5●添加名片

首先，用户登录成功后，进入名片管理系统的主页面。然后，用户在名片管理主页面单击“添加名片”超链接打开添加名片页面。最后，用户输入客户名片的姓名、电话、E-Mail、单位、职务、地址、Logo后，单击“添加”按钮实现添加。如果成功，则跳转到名片管理主页面；如果失败，则回到添加名片页面。

addCard.jsp页面实现添加名片信息的输入界面，如图4.3所示。

■ 图4.3 添加名片页面

单击图4.3中“添加”按钮，将添加请求通过“card/addCard?act=add”提交给控制器类CardController（4.5.2节）的addCard方法进行添加功能处理。添加成功跳转到名片管理主页面；添加失败回到添加名片页面。

6●名片管理主页面

用户登录成功后，进入名片管理系统的主页面（main.jsp），运行效果如图4.4所示。

■ 图4.4 名片管理主页面

在主页面中单击“详情”超链接，打开名片详细信息页面detail.jsp。“详情”超链接的目标地址是个url请求。该请求路径为“card/detail?id=${card.id}&act=detail”。根据请求路径找到对应控制器类CardController的detail方法处理查询一个名片功能。根据动作类型（“修改”以及“详情”），将查询结果转发到不同视图。名片详细信息页面cardDetail.jsp运行效果如图4.5所示。

■ 图4.5 名片详情

7●修改名片

单击名片管理主页面中“修改”超链接，打开修改名片信息页面updateCard.jsp。“修改”超链接的目标地址是url请求card/detail?id=${card.id}&act=update。找到对应控制器类CardController的方法detail，在该方法中，根据动作类型，将查询结果转发给updateCard.jsp页面显示。

输入要修改的信息后，单击“修改”按钮，将名片信息提交给控制器类，找到对应控制器类CardController的方法addCard，在addCard方法中根据动作类型，执行修改的业务处理。修改成功，进入名片管理主页面。修改失败，回到updateCard.jsp页面。

updateCard.jsp页面的运行效果如图4.6所示。

■ 图4.6 updateCard.jsp页面

8●删除名片

在名片管理主页面中，单击“删除”超链接，将要删除名片的ID通过Ajax提交给控制器类。找到对应控制器类CardController的方法delete，在该方法中，执行删除的业务处理。删除成功后，进入管理主页面

05、用户相关

1●Controller实现

在本系统中，与用户相关的功能包括用户注册、用户登录以及用户检查等，由控制器类UserController负责处理。

2●Service实现

与用户相关的Service接口和实现类分别为UserService和UserServiceImpl。控制器获取一个请求后，需要调用Service层中业务处理方法，在Service层中需要调用Dao层。所以，Service层是控制器层和Dao层的桥梁。UserService接口的代码略。

UserServiceImpl实现类的核心代码如下：

@Service
public class UserServiceImpl implements UserService{@Autowiredprivate UserMapper userMapper;/**** 检查用户名是否可用*/@Overridepublic String checkUname(MyUser myUser) {List<MyUserTable> userList = userMapper.selectByUname(myUser);if(userList.size() > 0)return "no";return "ok";}/*** 实现注册功能*/@Overridepublic String register(MyUser myUser) {//将明文变成密文myUser.setUpwd(MD5Util.MD5(myUser.getUpwd()));if(userMapper.register(myUser) > 0)return "login";return "register";}/*** 实现登录功能*/@Overridepublic String login(MyUser myUser, Model model, HttpSession session) {//ValidateCodeController中的randString code = (String)session.getAttribute("rand");if(!code.equalsIgnoreCase(myUser.getCode())) {model.addAttribute("errorMessage", "验证码错误！");return "login";}else {//将明文变成密文myUser.setUpwd(MD5Util.MD5(myUser.getUpwd()));List<MyUserTable> list = userMapper.login(myUser);if(list.size() > 0){session.setAttribute("userLogin", list.get(0));return "redirect:/card/selectAllCardsByPage?currentPage=1";}else {model.addAttribute("errorMessage", "用户名或密码错误！");return "login";}}}
}

3●Dao实现

Dao层是数据访问层，即@Repository注解的数据操作接口（接口中的方法与SQL映射文件中元素的id对应），与用户相关的数据访问层为UserMapper。

4●SQL映射文件

SQL映射文件的namespace属性与数据操作接口对应。与用户相关的SQL映射文件是UserMapper.xml（位于dao包中），具体代码如下：

<?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">
<mapper namespace="dao.UserMapper"><select id="selectByUname"  resultType="MyUserTable" parameterType="MyUser">select * from usertable where uname = #{uname}</select><insert id="register" parameterType="MyUser">insert into usertable (id,uname,upwd) values(null,#{uname},#{upwd})</insert><select id="login" parameterType="MyUser" resultType="MyUserTable">select * from usertable where uname=#{uname} and upwd=#{upwd}</select>
</mapper>

5●注册

在登录页面login.jsp，单击“注册”链接，打开注册页面register.jsp，效果如图4.7所示。

■ 图4.7 注册页面

在图4.7所示的注册页面中，输入“姓名”后，系统将通过Ajax提交“user/checkUname” 请求检测“姓名”是否可用。输入合法的用户信息后，单击“注册”按钮，实现注册功能。

6●登录

在浏览器中，通过地址http://localhost:8080/ch4打开登录页面login.jsp，效果如图4.8所示。

■ 图4.8 登录界面

用户输入姓名、密码和验证码后，系统将对姓名、密码和验证码进行验证。如果姓名、密码和验证码同时正确，则登录成功，将用户信息保存到session对象，并进入系统管理主页面（main.jsp）；如果输入有误，则提示错误。

7●修改密码

单击名片管理主页面中的“修改密码”菜单，打开密码修改页面updatePwd.jsp。密码修好页面效果如图4.9所示。

■ 图4.9 密码修改页面

在图4.9中输入“新密码”后，单击“修改”按钮，将请求通过“card/updatePwd”提交给控制器类。根据请求路径找到对应控制器类CardController的updatePwd方法处理密码修改请求。这里找控制器类CardController处理密码修改，是因为用户必须登录成功后才能修改密码。

8●安全退出

在名片管理主页面中，单击“安全退出”菜单，将返回登录页面。“安全退出”超链接的目标地址是一个请求card/loginOut，找到控制器类CardController的对应处理方法loginOut。这里找控制器类CardController处理安全退出，是因为用户必须登录成功后才能安全退出。

06、小结

本章讲述了名片管理系统的设计与实现。通过我们的学习，不仅掌握SSM框架整合开发的流程、方法和技术，还应该熟悉名片管理的业务需求、设计以及实现。

全栈开发实战｜名片管理系统的设计与实现（SSM + JSP）相关推荐

《Spring Boot+Vue全栈开发实战》读书笔记
写在前面嗯,回家处理一些事,所以离职了,之前的公司用开源技术封装了一套自己的低代码平台,所以之前学的spring Boot之类的东西都忘了很多,蹭回家的闲暇时间复习下. 笔记整体以 Spring B ...
读书笔记《Spring Boot+Vue全栈开发实战》(下)
本书将带你全面了解Spring Boot基础与实践,带领读者一步步进入 Spring Boot 的世界. 前言第九章 Spring Boot缓存第十章 Spring Boot安全管理第十一章 S ...
ehcache springboot_阿里内部进阶学习SpringBoot+Vue全栈开发实战文档
前言 Spring 作为一个轻量级的容器,在JavaEE开发中得到了广泛的应用,但是Spring 的配置烦琐臃肿,在和各种第三方框架进行整合时代码量都非常大,并且整合的代码大多是重复的,为了使开发者能 ...
【全栈开发实战小草看书之Web端（八）主入口】
全栈开发实战小草看书之Web端(八)主入口 Html文件(index.html) <!DOCTYPE html> <html lang="en"><h ...
ChatGPT全栈开发实战：从需求分析到数据可视化，一站式指南助你快速构建全面应用
<ChatGPT全栈开发实战:从需求分析到数据可视化,一站式指南助你快速构建全面应用>是一本旨在引领我们进入全栈开发世界的综合指南.通过结合强大的ChatGPT技术和全栈开发的实践,我们将 ...
web 全栈开发-实战项目-一
一.web 全栈开发-实战项目项目描述: ou-article文章管理系统,包括pc页面展示(自适应移动端),后台文章管理系统(有完整的权限系统),server服务端,以及环境部署. 适合人群: 有 ...
52abp框架asp.net core Angular全栈开发实战视频课程
课程标题 52abp框架asp.net core & Angular全栈开发实战视频课程课程简介从零开始学 52ABP企业开发框架,企业项目是如何开发和技术选型,代码如何管理,团队协同开发 ...
Spring Boot 专栏全栈开发实战
2020 年 11 月 12 日,Spring 官方发布了 Spring Boot 2.4.0 GA 的公告,链接为 Spring Boot 2.4.0 available now.为了让大家能够学习 ...
Python高级全栈开发实战老男孩课程S16+路飞学城项目+女神串讲 Python全栈直通车课程
python高级全栈开发实战老男孩课程S16+路飞学城项目+女神串讲 Python全栈直通车课程 Python高级全栈开发实战老男孩课程,是可以帮助同学们从零基础开始到项目开发实战的全栈课程,内容非 ...
物联网全栈开发实战系列文章汇总（共865篇，持续更新-2023.05.02）
物联网全栈开发实战(共865篇) 文章目录物联网全栈开发实战(共865篇) 1.Arduino单片机系列 1.1 Arduino开发实例(包含各类传感器驱动.通信实例.DIY实例,共114篇) 1. ...

全栈开发实战｜名片管理系统的设计与实现（SSM + JSP）

01、系统设计

1●系统功能需求

2●系统模块划分

02、数据库设计

1●数据库概念结构设计

2●数据库逻辑结构设计

03、系统管理

1●JSP页面管理

04、名片管理

1●Controller实现

2●Service实现

3●Dao实现

4●SQL映射文件

5●添加名片

6●名片管理主页面

7●修改名片

8●删除名片

05、用户相关

1●Controller实现

2●Service实现

3●Dao实现

4●SQL映射文件

5●注册

6●登录

7●修改密码

8●安全退出

06、小结

全栈开发实战｜名片管理系统的设计与实现（SSM + JSP）相关推荐

最新文章

热门文章

全栈开发实战｜​名片管理系统的设计与实现（SSM + JSP）

01、系统设计

1●系统功能需求

2●系统模块划分

02、数据库设计

1●数据库概念结构设计

2●数据库逻辑结构设计

03、系统管理

1●JSP页面管理

04、名片管理

1●Controller实现

2●Service实现

3●Dao实现

4●SQL映射文件

5●添加名片

6●名片管理主页面

7●修改名片

8●删除名片

05、用户相关

1●Controller实现

2●Service实现

3●Dao实现

4●SQL映射文件

5●注册

6●登录

7●修改密码

8●安全退出

06、小结

全栈开发实战｜​名片管理系统的设计与实现（SSM + JSP）相关推荐

最新文章

热门文章

全栈开发实战｜名片管理系统的设计与实现（SSM + JSP）

全栈开发实战｜名片管理系统的设计与实现（SSM + JSP）相关推荐