业务人员可以在后台管理系统中,对课程信息、讲师信息、 学员信息等数据进行维护
课程管理模块中都包含的内容:
一个接口的描述至少包括下面几项:
名称: findCourseList
描述: 根据条件查询课程信息
请求方式: GET
请求参数
"methodName": "findCourseList"{
"status": "0",
"msg": "success"
}UI 出好设计图之后,前端开发工程师只负责将设计图切成 HTML,需要由 Java 开发工程师来将 HTML 套成 JSP 页面,修改问题的时候需要双方协同开发,效率低下JSP 页面必须要在支持 Java 的 WEB 服务器上运行(如 Tomcat、Jetty 等),无法使用 Nginx 等(官方宣称单实例 HTTP 并发高达 5W ),性能提升不上来JSP,必须要在 WEB 服务器中编译成 Servlet,第一次运行会较慢。 之后的每次请求 JSP 都是访问 Servlet 再用输出流输出的 HTML 页面,效率没有直接使用 HTML 高| 前端技术 | 说明 |
|---|---|
| Vue.js | 是一套用于构建用户界面的渐进式 JavaScript 框架 |
| Element UI库 | element-ui 是饿了么前端出品的基于 Vue.js 的 后台组件库,方便程序员进行页面快速布局和构建 |
| node.js | 简单的说 Node.js 就是运行在服务端的 JavaScript 运行环境 |
| axios | 对 ajax 的封装, 简单来说就是 ajax 技术实现了局部数据的刷新,axios 实现对 ajax 的封装 |
| 后端技术 | 说明 |
|---|---|
| Web 层 | a) Servlet:前端控制器 b) Filter:过滤器 c) BeanUtils:数据封装 |
| Service 层 | a) 业务处理 |
| dao 层 | a) Mysql:数据库 b) Druid:数据库连接池 c) DBUtils: 操作数据库 |
实现以下功能:
营销信息,其实就是设置课程的详细信息
回显课程信息
修改课程信息,包含了图片上传
配置节指的是对课程下所属的章节与节进行配置(一个课程对应多个章节,一个章节有多个节)
以树形结构的下拉框形式, 展示课程对应的章节与节信息
添加章节功能
修改章节功能
修改章节状态功能
CREATE DATABASE IF NOT EXISTS `lagou_edu` DEFAULT CHARACTER SET utf8;
USE `lagou_edu`;
DROP TABLE IF EXISTS `course`;
CREATE TABLE `course` (
`id` int(11) unsigned NOT NULL AUTO_INCREMENT COMMENT 'id',
`course_name` varchar(255) DEFAULT NULL COMMENT '课程名',
`brief` varchar(255) DEFAULT NULL COMMENT '课程一句话简介',
`teacher_name` varchar(255) DEFAULT NULL COMMENT '讲师名称',
`teacher_info` varchar(255) DEFAULT NULL COMMENT '讲师介绍',
`total_course_time` int(5) DEFAULT NULL COMMENT '节数',
`sales` int(11) DEFAULT '0' COMMENT '显示销量',
`actual_sales` int(11) DEFAULT '0' COMMENT '真实销量',
`price` double(10,2) DEFAULT NULL COMMENT '原价',
`price_tag` varchar(255) DEFAULT NULL COMMENT '原价标签',
`discounts` double(10,2) DEFAULT NULL COMMENT '优惠价',
`course_description` longtext COMMENT '课程描述',
`course_img_url` varchar(255) DEFAULT NULL COMMENT '课程分享图片url',
`is_new` tinyint(1) DEFAULT NULL COMMENT '是否新品',
`is_new_des` varchar(255) DEFAULT NULL COMMENT '广告语',
`last_operator_id` int(11) DEFAULT NULL COMMENT '最后操作者',
`create_time` datetime DEFAULT NULL COMMENT '记录创建时间',
`update_time` datetime DEFAULT NULL COMMENT '更新时间',
`is_del` tinyint(1) DEFAULT '0' COMMENT '是否删除,0未删除,1删除',
`total_duration` int(11) DEFAULT NULL COMMENT '总时长(分钟)',
`share_title` varchar(255) DEFAULT NULL COMMENT '分享title',
`share_description` text COMMENT '分享描述',
`share_image_title` varchar(255) DEFAULT NULL COMMENT '分享图title',
`status` int(2) DEFAULT NULL COMMENT '课程状态,0-草稿,1-上架',
`sort_num` int(11) DEFAULT NULL COMMENT '课程排序,用于后台保存草稿时用到',
`course_type` tinyint(3) DEFAULT NULL COMMENT '课程类型: 1 音视频课 2 伴读课',
`last_notice_time` datetime DEFAULT NULL COMMENT '最后课程最近通知时间',
`preview_first_field` varchar(255) DEFAULT NULL COMMENT '课程预览第一个字段',
`preview_second_field` varchar(255) DEFAULT NULL COMMENT '课程预览第二个字段',
`is_gray` tinyint(1) DEFAULT '0' COMMENT '是否是灰度课程',
`grade` tinyint(2) DEFAULT '0' COMMENT '0 初级 1 初中级 2 中级 3 中高级 4 高级',
PRIMARY KEY (`id`) USING BTREE
) ENGINE=InnoDBDROP TABLE IF EXISTS `course_lesson`;
CREATE TABLE `course_lesson` (
`id` int(11) unsigned NOT NULL AUTO_INCREMENT COMMENT 'id',
`course_id` int(11) NOT NULL COMMENT '课程id',
`section_id` int(11) NOT NULL DEFAULT '0' COMMENT '章节id',
`theme` varchar(255) NOT NULL COMMENT '节主题',
`duration` int(11) NOT NULL DEFAULT '0' COMMENT '节时长(分钟)',
`is_free` tinyint(1) NOT NULL DEFAULT '0' COMMENT '是否免费',
`start_img_url` varchar(255) DEFAULT NULL COMMENT '节背景图',
`text_content` mediumtext COMMENT '节内容',
`markdown_text_content` mediumtext COMMENT '节内容(markdown文本)',
`transcode` varchar(100) DEFAULT NULL COMMENT '转码集合',
`resource_url` varchar(255) DEFAULT NULL COMMENT '课程资源路径',
`last_operator_id` int(11) DEFAULT NULL COMMENT '最后操作者id',
`create_time` datetime DEFAULT NULL COMMENT '记录创建时间',
`update_time` datetime DEFAULT NULL COMMENT '更新时间',
`is_del` tinyint(1) DEFAULT '0' COMMENT '是否删除',
`order_num` int(11) DEFAULT NULL COMMENT '排序字段',
`ali_file_url` varchar(255) DEFAULT NULL COMMENT '阿里云视频文件URL',
`ali_file_dk` varchar(255) DEFAULT NULL COMMENT '阿里云视频文件的DK',
`ali_file_edk` varchar(255) DEFAULT NULL COMMENT '阿里云视频文件的EDK',
`ali_file_vid` varchar(50) DEFAULT NULL COMMENT '阿里云视频资源文件ID',
`status` int(2) DEFAULT NULL COMMENT '节状态,0-隐藏,1-未发布,2-已发布',
`is_timing_publish` tinyint(1) DEFAULT '0' COMMENT '是否定时发布',
`publish_time` datetime DEFAULT '1970-01-01 08:00:00' COMMENT '定时发布时间',
PRIMARY KEY (`id`) USING BTREE,
KEY `course_id_index` (`course_id`,`section_id`) USING BTREE,
KEY `idx_sectionId_orderNum` (`section_id`,`order_num`) USING BTREE
) ENGINE=InnoDB AUTO_INCREMENT=52 DEFAULT CHARSET=utf8;DROP TABLE IF EXISTS `course_media`;
CREATE TABLE `course_media` (
`id` int(11) NOT NULL AUTO_INCREMENT COMMENT '课程媒体主键ID',
`course_id` int(11) NOT NULL COMMENT '课程Id',
`section_id` int(11) NOT NULL COMMENT '章ID',
`lesson_id` int(11) NOT NULL COMMENT '节ID',
`channel` int(2) DEFAULT NULL COMMENT '媒体渠道,1-阿里云',
`media_type` int(2) DEFAULT NULL COMMENT '媒体类型,0-音频,1-视频',
`cover_image_url` varchar(255) COLLATE utf8mb4_unicode_ci DEFAULT NULL COMMENT '封面图URL',
`duration` varchar(50) COLLATE utf8mb4_unicode_ci DEFAULT NULL COMMENT '时长(06:02)',
`file_id` varchar(50) COLLATE utf8mb4_unicode_ci DEFAULT NULL COMMENT '媒体资源文件ID',
`file_url` varchar(512) COLLATE utf8mb4_unicode_ci DEFAULT NULL COMMENT '媒体文件URL,目前只有音频使用',
`file_edk` varchar(255) COLLATE utf8mb4_unicode_ci DEFAULT NULL COMMENT '媒体资源文件对应的EDK',
`file_size` double(10,2) DEFAULT NULL COMMENT '文件大小MB',
`file_name` varchar(100) COLLATE utf8mb4_unicode_ci DEFAULT NULL COMMENT '文件名称',
`file_dk` varchar(100) COLLATE utf8mb4_unicode_ci DEFAULT NULL COMMENT '媒体资源文件对应的DK',
`create_time` datetime DEFAULT NULL COMMENT '创建时间',
`update_time` datetime DEFAULT NULL COMMENT '更新时间',
`status` int(2) DEFAULT NULL COMMENT '媒体状态',
`is_del` tinyint(1) DEFAULT '0' COMMENT '是否删除,0未删除,1删除',
`last_operator_id` int(11) DEFAULT NULL COMMENT '最后操作者ID',
`duration_num` int(11) DEFAULT NULL COMMENT '时长,秒数(主要用于音频在H5控件中使用)',
PRIMARY KEY (`id`) USING BTREE,
UNIQUE KEY `uniq_lessonid_channel_mediatype_idx` (`lesson_id`,`channel`,`media_type`) USING BTREE,
KEY `fileid_idx` (`file_id`) USING BTREE
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;DROP TABLE IF EXISTS `course_section`;
CREATE TABLE `course_section` (
`id` int(11) unsigned NOT NULL AUTO_INCREMENT COMMENT 'id',
`course_id` int(11) NOT NULL COMMENT '课程id',
`section_name` varchar(255) NOT NULL COMMENT '章节名',
`description` varchar(255) NOT NULL COMMENT '章节描述',
`last_operator` varchar(255) DEFAULT NULL COMMENT '最后操作者',
`create_time` datetime NOT NULL COMMENT '记录创建时间',
`update_time` datetime NOT NULL COMMENT '更新时间',
`is_visible` tinyint(1) DEFAULT '1' COMMENT '是否可见',
`is_del` tinyint(4) DEFAULT NULL COMMENT '是否删除 0-未删除,1-已删除',
`order_num` int(11) DEFAULT NULL COMMENT '排序字段',
`last_operator_id` int(11) DEFAULT NULL COMMENT '最后操作者ID',
`status` int(1) DEFAULT NULL COMMENT '状态,0:隐藏;1:待更新;2:已发布',
PRIMARY KEY (`id`) USING BTREE,
KEY `course_id_index` (`course_id`) USING BTREE,
KEY `idx_course_id` (`course_id`) USING BTREE
) ENGINE=InnoDB AUTO_INCREMENT=44 DEFAULT CHARSET=utf8;四张表的层级关系(一对多递进):
course(课程) 1 → N course_section(章节):通过 course_section.course_id 关联course_section(章节) 1 → N course_lesson(节):通过 course_lesson.course_id + section_id 关联course_lesson(节) 1 → N course_media(媒体资源):通过 course_media.lesson_id 关联(同一节下音频/视频各一条,由唯一键约束)使用 Maven 快速构建工程, 项目名为: lagou_edu_home
选择 maven 直接 next
填写项目相关信息,创建 maven 项目
当前maven项目还不是 一个 web 项目,进行一下改造
详见 Maven工程改造
<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>com.lagou</groupId>
<artifactId>lagou_edu_home</artifactId>
<version>1.0-SNAPSHOT</version>
<packaging>war</packaging>
<!-- properties 是全局设置,可以设置整个maven项目的编译器 JDK版本 -->
<properties>
<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
<maven.compiler.source>11</maven.compiler.source>
<maven.compiler.target>11</maven.compiler.target>
</properties>
<dependencies>
<!-- Servlet -->
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>javax.servlet-api</artifactId>
<version>3.1.0</version>
<scope>provided</scope>
</dependency>
<dependency>
<groupId>javax.servlet.jsp</groupId>
<artifactId>jsp-api</artifactId>
<version>2.2</version>
<scope>provided</scope>
</dependency>
<dependency>
<groupId>junit</groupId>
<artifactId>junit</artifactId>
<version>4.13</version>
<scope>test</scope>
</dependency>
<!-- Beanutils -->
<dependency>
<groupId>commons-beanutils</groupId>
<artifactId>commons-beanutils</artifactId>
<version>1.8.3</version>
</dependency>
<!-- DBUtils -->
<dependency>
<groupId>commons-dbutils</groupId>
<artifactId>commons-dbutils</artifactId>
<version>1.6</version>
</dependency>
<dependency>
<groupId>commons-logging</groupId>
<artifactId>commons-logging</artifactId>
<version>1.1.1</version>
</dependency>
<!-- 数据库相关 -->
<dependency>
<groupId>mysql</groupId>
<artifactId>mysql-connector-java</artifactId>
<version>5.1.37</version>
</dependency>
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>druid</artifactId>
<version>1.0.9</version>
</dependency>
<!--fastjson工具包 -->
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>fastjson</artifactId>
<version>1.2.3</version>
</dependency>
<dependency>
<groupId>com.colobu</groupId>
<artifactId>fastjson-jaxrs-json-provider</artifactId>
<version>0.3.1</version>
</dependency>
<!-- 文件上传 -->
<dependency>
<groupId>commons-io</groupId>
<artifactId>commons-io</artifactId>
<version>1.4</version>
</dependency>
<dependency>
<groupId>commons-fileupload</groupId>
<artifactId>commons-fileupload</artifactId>
<version>1.2.1</version>
</dependency>
<!-- Lombok -->
<dependency>
<groupId>org.projectlombok</groupId>
<artifactId>lombok</artifactId>
<version>1.18.0</version>
<scope>provided</scope>
</dependency>
</dependencies>
<build>
<plugins>
<!-- maven编译插件 -->
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-compiler-plugin</artifactId>
<version>3.8.1</version>
<configuration>
<release>11</release>
</configuration>
</plugin>
</plugins>
</build>
</project>在项目中使用 Lombok 可以减少很多重复代码的书写。比如说 getter/setter/toString 等方法的编写。
打开IDEA的 Setting –> 选择 Plugins 选项 –> 搜索 lombok –> 点击安装 –> 安装完成重启 IDEA
在项目中添加 Lombok 依赖 jar,在 pom 文件中添加如下部分
<dependency>
<groupId>org.projectlombok</groupId>
<artifactId>lombok</artifactId>
<version>1.18.0</version>
<scope>provided</scope>
</dependency>导入表对应的实体类
课程模块下有两个子模块:
每个模块下都有很多的功能, 比如课程模块的新建课程, 上架课程,下架课程,根据课程名查询等等功能 , 每一个功能都是一个 Servlet
我们使用一个 Servlet 对应一个模块的方式进行开发
index.jsp
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>$Title$</title>
</head>
<body>
<%-- 一个模块对应一个Servlet --%>
<a href="${pageContext.request.contextPath}/test?methodName=addCourse">新建课程</a>
<a href="${pageContext.request.contextPath}/test?methodName=findByName">根据课程名查询</a>
<a href="${pageContext.request.contextPath}/test?methodName=findByStatus">根据状态查询</a>
</body>
</html>TestServlet
// 模拟课程模块 ,模块中有很多功能
@WebServlet("/test")
public class TestServlet extends HttpServlet {
// doGet()方法作为调度器 控制器,根据请求的功能不同,调用对应的方法
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
//1.获取参数
//获取要调用的方法名
String methodName = req.getParameter("methodName");
//2.业务处理
//判断 执行对应的方法
if("addCourse".equals(methodName)){
addCourse(req,resp);
}else if("findByName".equals(methodName)){
findByName(req,resp);
}else if("findByStatus".equals(methodName)){
findByStatus(req,resp);
}else{
System.out.println("访问的功能不存在!");
}
}
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
doGet(req,resp);
}
// 2.模块对应的功能部分
public void addCourse(HttpServletRequest req, HttpServletResponse resp){
System.out.println("新建课程");
}
public void findByStatus(HttpServletRequest req, HttpServletResponse resp){
System.out.println("根据状态查询");
}
public void findByName(HttpServletRequest req, HttpServletResponse resp){
System.out.println("根据课程名称查询");
}
}我们可以使用反射去对代码进行优化, 提升代码的可维护性/可扩展性.
反射的知识回顾:
第一步:先获取请求携带的方法参数值
第二步:获取指定类的字节码对象
第三步:根据请求携带的方法参数值,再通过字节码对象获取指定的方法
第四步:最后执行指定的方法
@WebServlet("/test")
public class TestServlet extends HttpServlet {
// doGet()方法作为调度器 控制器,根据请求的功能不同,调用对应的方法
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
try {
//1.获取参数 获取要调用的方法名
String methodName = req.getParameter("methodName");
//2.业务处理
if(methodName != null){
//通过反射优化代码,提升代码的可维护性
//1.获取字节码对象 this = TestServlet对象
Class c = this.getClass();
//2.根据传入的方法名, 获取对应方法对象,执行方法即可
Method method = c.getMethod(methodName, HttpServletRequest.class, HttpServletResponse.class);
//3.调用Method对象的 invoke()方法,执行对应的功能
method.invoke(this,req,resp);
}
} catch (Exception e) {
System.out.println("请求的功能不存在! !");
e.printStackTrace();
}
}
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
doGet(req,resp);
}
// 2.模块对应的功能部分
public void addCourse(HttpServletRequest req, HttpServletResponse resp){
System.out.println("新建课程");
}
public void findByStatus(HttpServletRequest req, HttpServletResponse resp){
System.out.println("根据状态查询");
}
public void findByName(HttpServletRequest req, HttpServletResponse resp){
System.out.println("根据课程名称查询");
}
}当前代码依然存在问题:每个 Servlet 都需要写一份相同的反射代码
解决方案: 将反射相关的代码抽取到一个类中 BaseServlet, 让 BaseServlet 去继承 HTTPServlet
public class BaseServlet extends HttpServlet {
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
try {
//1.获取参数
//获取要调用的方法名
String methodName = req.getParameter("methodName");
//2.业务处理
if(methodName != null){
//通过反射优化代码,提升代码的可维护性
//1.获取字节码对象 this = TestServlet对象
Class c = this.getClass();
//2.根据传入的方法名, 获取对应方法对象,执行方法即可
Method method = c.getMethod(methodName, HttpServletRequest.class, HttpServletResponse.class);
//3.调用Method对象的 invoke()方法,执行对应的功能
method.invoke(this,req,resp);
}
} catch (Exception e) {
System.out.println("请求的功能不存在! !");
e.printStackTrace();
}
}
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
doGet(req,resp);
}
}@WebServlet("/test")
public class TestServlet extends BaseServlet {
/**
* 在模块对应的Servlet中只保留 业务相关代码
* 当有请求访问到 TestServlet时, 发现没有doGet和doPost方法,就回去父类中找,从而执行BaseServlet中的
* doGet方法
* */
public void addCourse(HttpServletRequest req, HttpServletResponse resp){
System.out.println("新建课程");
}
public void findByStatus(HttpServletRequest req, HttpServletResponse resp){
System.out.println("根据状态查询");
}
public void findByName(HttpServletRequest req, HttpServletResponse resp){
System.out.println("根据课程名称查询");
}
}| 特性 | 旧版(本文编写时) | 当前(Spring Boot 3.5.x) |
|---|---|---|
| 项目结构 | 传统 Web 工程(webapp/WEB-INF) | Maven 标准结构 + Boot 自动配置 |
| Servlet 包名 | javax.servlet.* | jakarta.servlet.* |
| 部署 | 外部 Tomcat + war | 内嵌 Tomcat + jar,或 war 部署 |
| 数据访问 | JDBC/JSP | MyBatis/JPA + Thymeleaf |
| 单体边界 | 单体应用 | 仍是主流起步形态;可演进为微服务 |
单体项目结构是理解 Web 应用分层的基础;新项目建议直接采用 Spring Boot 3.5.x 分层结构(Controller/Service/Mapper),本文的分层思想依然适用。