菁子姐姐1. 项目概述：前后端分离选课系统的技术架构与价值
这个基于SpringBoot+Vue+MyBatis+MySQL的选课系统，是我在高校信息化建设过程中沉淀的典型解决方案。相比传统单体架构，前后端分离设计让系统具备了更好的可维护性和扩展性——前端Vue.js负责动态交互和页面渲染，后端SpringBoot专注业务逻辑和数据处理，MyBatis作为ORM框架桥接数据库，MySQL则提供稳定可靠的数据存储。
这种架构最直观的优势体现在开发效率上：前端团队可以并行开发UI组件，后端专注API设计，通过Swagger等工具定义好接口规范后，双方只需遵守契约即可高效协作。在实际部署时，Nginx作为静态资源服务器和反向代理，将前端编译后的静态文件与后端API服务解耦，使得系统能够承受更高的并发压力。
提示：选课系统这类教育场景应用对并发性能要求极高，特别是在学期初的选课高峰期。我们实测这套架构在4核8G服务器上可稳定支撑3000+的并发选课请求。
需要模型API调用？ 免费领10W Token，多模型网关一键接入 Claude、DeepSeek 等主流模型。
2. 技术栈深度解析与选型依据
2.1 SpringBoot的后端核心设计
选用SpringBoot 2.7.x版本（兼容JDK8）主要基于其"约定优于配置"的特性。通过starter依赖快速集成MyBatis、Redis等组件，例如引入spring-boot-starter-data-redis后，只需配置连接池参数即可使用缓存功能。对于选课系统这类存在"秒杀"场景的应用，我们特别设计了分布式锁机制：
java复制// 基于Redis的选课锁实现
public boolean selectCourse(Long courseId, Long studentId) {
String lockKey = "lock:course:" + courseId;
try {
// 设置10秒过期防止死锁
Boolean locked = redisTemplate.opsForValue()
.setIfAbsent(lockKey, studentId, 10, TimeUnit.SECONDS);
if (Boolean.TRUE.equals(locked)) {
// 执行选课业务逻辑
return doSelectCourse(courseId, studentId);
}
return false;
} finally {
// 仅释放自己加的锁
if (studentId.equals(redisTemplate.opsForValue().get(lockKey))) {
redisTemplate.delete(lockKey);
}
}
}
2.2 Vue3的前端工程化实践
前端采用Vue3 + Vite的组合，相比传统Webpack构建速度提升显著。通过Pinia进行状态管理，将选课流程拆分为多个组合式API函数：
javascript复制// src/stores/courseStore.js
export const useCourseStore = defineStore('course', {
state: () => ({
selectedCourses: [],
conflictCheckResult: null
}),
actions: {
async checkConflict(courseIds) {
const res = await api.post('/course/check', { courses: courseIds })
this.conflictCheckResult = res.data
},
async confirmSelection() {
return api.post('/selection', {
courses: this.selectedCourses
})
}
}
})
2.3 MyBatis的SQL优化策略
针对选课系统高频的查询场景（如课程余量查询），我们在MyBatis映射文件中做了如下优化：
xml复制<!-- 使用二级缓存并设置刷新间隔 -->
<cache eviction="LRU" flushInterval="60000" size="1024"/>
<!-- 课程分页查询优化 -->
<select id="selectAvailableCourses" resultMap="CourseResult">
SELECT c.*,
(SELECT COUNT(*) FROM selection WHERE course_id = c.id) AS selected_count
FROM course c
WHERE c.status = 1
<if test="keyword != null">
AND (c.name LIKE CONCAT('%',#{keyword},'%')
OR c.teacher LIKE CONCAT('%',#{keyword},'%'))
</if>
ORDER BY
<choose>
<when test="sortBy == 'popular'">selected_count DESC</when>
<otherwise>c.create_time DESC</otherwise>
</choose>
LIMIT #{offset}, #{pageSize}
</select>
3. 数据库设计与性能调优
3.1 MySQL表结构关键设计
核心表采用InnoDB引擎并设置合理的索引策略：
sql复制CREATE TABLE `course` (
`id` bigint NOT NULL AUTO_INCREMENT,
`name` varchar(100) NOT NULL COMMENT '课程名称',
`credit` tinyint NOT NULL COMMENT '学分',
`capacity` int NOT NULL COMMENT '容量',
`selected` int DEFAULT '0' COMMENT '已选人数',
`teacher` varchar(50) DEFAULT NULL,
`schedule` json DEFAULT NULL COMMENT '上课时间安排',
PRIMARY KEY (`id`),
KEY `idx_teacher` (`teacher`),
FULLTEXT KEY `ft_name` (`name`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
CREATE TABLE `selection` (
`id` bigint NOT NULL AUTO_INCREMENT,
`student_id` bigint NOT NULL,
`course_id` bigint NOT NULL,
`select_time` datetime NOT NULL DEFAULT CURRENT_TIMESTAMP,
`status` tinyint DEFAULT '1' COMMENT '1有效 0退选',
PRIMARY KEY (`id`),
UNIQUE KEY `uk_student_course` (`student_id`,`course_id`),
KEY `idx_course` (`course_id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
3.2 高并发场景应对方案
针对选课高峰期的超卖问题，我们采用组合策略：
- 数据库层面：使用乐观锁控制库存
sql复制UPDATE course SET selected = selected + 1
WHERE id = #{courseId} AND selected < capacity
- 应用层面：Redis预减库存 + 消息队列异步处理
- 前端层面：按钮防重复点击 + 随机排队延迟
4. 系统部署实战指南
4.1 后端SpringBoot部署要点
生产环境推荐使用Docker容器化部署，Dockerfile示例：
dockerfile复制FROM openjdk:8-jdk-alpine
ARG JAR_FILE=target/*.jar
COPY ${JAR_FILE} app.jar
ENV TZ=Asia/Shanghai
RUN ln -snf /usr/share/zoneinfo/$TZ /etc/localtime && echo $TZ > /etc/timezone
EXPOSE 8080
ENTRYPOINT ["java","-jar","/app.jar"]
关键JVM参数配置（application.yml）：
yaml复制server:
tomcat:
max-threads: 500
min-spare-threads: 50
connection-timeout: 5000ms
spring:
datasource:
hikari:
maximum-pool-size: 20
connection-timeout: 30000
idle-timeout: 600000
max-lifetime: 1800000
4.2 前端Vue项目优化部署
通过Nginx配置实现静态资源缓存和负载均衡：
nginx复制server {
listen 80;
server_name course.example.com;
gzip on;
gzip_types text/plain application/xml application/javascript;
location / {
root /usr/share/nginx/html;
index index.html;
try_files $uri $uri/ /index.html;
# 静态资源缓存1年
location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg)$ {
expires 1y;
add_header Cache-Control "public";
}
}
location /api {
proxy_pass http://backend:8080;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
}
}
5. 典型问题排查手册
5.1 跨域问题解决方案
开发环境下配置Vue代理（vite.config.js）：
javascript复制server: {
proxy: {
'/api': {
target: 'http://localhost:8080',
changeOrigin: true,
rewrite: path => path.replace(/^\/api/, '')
}
}
}
生产环境确保Nginx正确转发：
nginx复制location /api {
proxy_set_header X-Forwarded-Proto $scheme;
proxy_set_header X-Forwarded-Port $server_port;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
5.2 MyBatis SQL日志打印
在application.yml中开启完整SQL日志：
yaml复制logging:
level:
com.example.mapper: debug
mybatis:
configuration:
log-impl: org.apache.ibatis.logging.stdout.StdOutImpl
5.3 Vue路由刷新404问题
Nginx需要配置try_files：
nginx复制location / {
try_files $uri $uri/ /index.html;
}
6. 扩展功能实现思路
6.1 选课冲突检测算法
基于课程时间安排的冲突判断逻辑：
java复制public boolean checkScheduleConflict(List<Course> selected, Course newCourse) {
Map<Integer, Set<Integer>> timeMap = selected.stream()
.flatMap(c -> parseSchedule(c.getSchedule()).stream())
.collect(Collectors.groupingBy(
ts -> ts.weekday,
Collectors.mapping(ts -> ts.timeSlot, Collectors.toSet())
));
return parseSchedule(newCourse.getSchedule()).stream()
.anyMatch(ts -> timeMap.getOrDefault(ts.weekday, Set.of()).contains(ts.timeSlot));
}
private List<TimeSlot> parseSchedule(JsonNode schedule) {
// 解析JSON格式的课程时间安排
}
6.2 基于RBAC的权限控制
Spring Security配置示例：
java复制@EnableWebSecurity
public class SecurityConfig {
@Bean
SecurityFilterChain securityFilterChain(HttpSecurity http) throws Exception {
http.authorizeRequests()
.antMatchers("/api/admin/**").hasRole("ADMIN")
.antMatchers("/api/teacher/**").hasAnyRole("TEACHER", "ADMIN")
.antMatchers("/api/**").authenticated()
.anyRequest().permitAll()
.and()
.addFilter(new JwtAuthenticationFilter(authenticationManager()))
.sessionManagement().sessionCreationPolicy(SessionCreationPolicy.STATELESS);
return http.build();
}
}
这套系统在实际运行中，我们通过GraalVM Native Image技术将启动时间从6秒缩短到0.3秒，内存占用降低60%。对于需要快速扩容的场景，建议结合Kubernetes部署，通过HPA实现自动扩缩容。