设计一个支持直播互动、录播回放、作业批改的在线教学平台，请说明前端技术栈、后端框架及实时通信方案。
三峡大学专任教师难度：中等
答案
1) 【一句话结论】
采用React（前端），Node.js（后端，Express框架），结合WebSocket（Socket.IO实现），视频存储用阿里云OSS+CDN加速，作业批改通过RabbitMQ异步处理，保障系统性能与实时性，支撑直播互动、录播回放、作业批改功能。
2) 【原理/概念讲解】
老师：要设计在线教学平台，需明确各层技术逻辑。
- 视频存储：录播视频用对象存储（如阿里云OSS），类比“云硬盘”，适合大文件存储，通过CDN加速（配置OSS的CDN加速，边缘节点缓存视频），提升播放速度。
- 作业批改流程：用户提交作业时，后端将批改任务（文件解析、反馈生成）推送到RabbitMQ消息队列，异步处理（避免阻塞主请求）；教师批改完成后，结果存入MySQL数据库，并通过WebSocket推送通知学生。
- 实时通信：WebSocket提供全双工长连接，心跳检测（30秒ping），超时（30秒）后重连（3次，间隔2秒），保障连接稳定。
- 负载均衡：Nginx作为反向代理，分发WebSocket连接，处理高并发。
3) 【对比与适用场景】
| 对比维度 | 前端框架（React vs Vue） | 后端框架（Node.js vs Python） | 实时通信方案（WebSocket vs Server-Socket） |
|---|---|---|---|
| 定义 | Facebook开发的JS库，构建用户界面 | JavaScript运行时环境，事件驱动 | 基于TCP的全双工协议 |
| 特性 | 虚拟DOM、组件化、单向数据流 | 异步非阻塞（Node.js），快速开发（Python） | 长连接、低延迟、双向通信 |
| 使用场景 | 大型复杂应用（如直播窗口） | 实时应用（如用户登录、作业提交） | 直播互动、弹幕发送 |
| 注意点 | 需配合状态管理（如Redux） | Node.js不适合CPU密集型任务 | 需服务器支持，浏览器兼容性 |
4) 【示例】
- 作业提交流程：
前端发送POST /api/submitHomework（文件流、用户ID），后端接收文件，上传至OSS（路径如oss://homework/202401/123.zip），存储路径存入MySQL；同时将批改任务发送到RabbitMQ。 - 教师批改流程：
后端从RabbitMQ消费任务，解析文件（如PDF转文本），生成反馈（如评分、批注），存入MySQL；通过WebSocket推送{"type":"homework","id":123,"score":95,"feedback":"优秀"}。 - 直播互动：
用户发送弹幕（{"type":"danmu","content":"你好"}），前端通过WebSocket发送，后端广播给所有在线用户。
5) 【面试口播版答案】
面试官您好，针对这个在线教学平台，我的设计思路是：前端采用React框架，利用组件化和虚拟DOM快速构建直播窗口、弹幕区、作业提交表单等交互界面；后端选择Node.js结合Express，因为其异步非阻塞模型能高效处理用户登录、作业提交等高并发请求；实时通信方面，采用WebSocket技术（通过Socket.IO实现），确保直播互动、弹幕发送等实时消息能快速传递，比如当用户发送弹幕时，服务器通过Socket.IO广播给所有在线学生，实现即时互动。视频存储方面，录播视频采用阿里云OSS，并通过CDN加速（配置OSS的CDN加速，边缘节点缓存视频），提升播放速度；作业批改流程中，用户提交的作业文件先上传到OSS，存储路径存入MySQL，教师批改时，后端将批改任务推送到RabbitMQ消息队列，异步处理（解析文件、生成反馈），避免阻塞系统，教师批改完成后，结果存入数据库，并通过WebSocket通知学生。整体技术栈兼顾了性能、开发效率和实时性，同时通过心跳检测（30秒ping）、重连策略（3次，间隔2秒）保障实时通信稳定，Nginx负载均衡处理高并发WebSocket连接，确保系统可扩展性。
6) 【追问清单】
- 问题：作业批改的异步处理如何保障消息不丢失？
回答要点：使用RabbitMQ的确认机制（ACK），若消息未确认则重试，结合消息持久化（确保消息不丢失）。 - 问题：视频存储的CDN加速具体如何配置？
回答要点：在OSS控制台创建CDN加速域名，配置源站为OSS的访问地址，设置缓存规则（如视频文件缓存24小时），边缘节点缓存提升播放速度。 - 问题：实时通信在高并发下如何保障连接稳定？
回答要点：Nginx作为反向代理分发WebSocket连接，支持WebSocket协议的负载均衡，结合心跳检测和重连机制（30秒ping，超时重连3次，间隔2秒）。
7) 【常见坑/雷区】
- 视频存储用关系型数据库：会导致大文件存储性能瓶颈，应使用对象存储。
- 作业批改同步处理：教师批改时阻塞系统，影响其他用户请求，应采用异步消息队列。
- 实时通信无心跳检测：连接断开后未重连，导致用户无法接收消息，应设置心跳检测和重连策略。
- WebSocket负载均衡未考虑：高并发下连接被Nginx拒绝，应使用支持WebSocket的负载均衡方案（如Nginx的WebSocket模式）。