# 国语教育平台配置指南 ## 本机IP: 192.168.137.1 --- ## 📁 一、本地电脑需要创建的文件夹 根据后端配置文件 `application.yml` 中的设置: ```yaml ruoyi: profile: D:\wwwroot\study_web\web\profile ``` ### 需要创建的完整目录结构: ``` D:\ └── wwwroot\ └── study_web\ └── web\ └── profile\ └── upload\ ├── courseware\ # 课件文件(视频、文档等) ├── voice\ # 语音评测音频文件 ├── screenshots\ # 屏幕监控截图 └── avatar\ # 用户头像 ``` ### Windows PowerShell 创建命令: ```powershell # 以管理员身份运行PowerShell,执行以下命令: New-Item -Path "D:\wwwroot\study_web\web\profile\upload\courseware" -ItemType Directory -Force New-Item -Path "D:\wwwroot\study_web\web\profile\upload\voice" -ItemType Directory -Force New-Item -Path "D:\wwwroot\study_web\web\profile\upload\screenshots" -ItemType Directory -Force New-Item -Path "D:\wwwroot\study_web\web\profile\upload\avatar" -ItemType Directory -Force ``` **说明:** - `courseware` - 存放课件文件(视频、PDF、PPT等) - `voice` - 存放语音评测的录音文件 - `screenshots` - 存放学习监控的屏幕截图 - `avatar` - 存放用户头像图片 --- ## 🔧 二、后端配置(Spring Boot) ### 1. 后端服务器地址配置 **文件**: `Study-Vue-redis\ry-study-admin\src\main\resources\application.yml` **当前配置**: ```yaml server: port: 30091 ruoyi: profile: D:\wwwroot\study_web\web\profile ``` **重要**: 确保后端监听所有网络接口,而不仅仅是 localhost。 如果你需要让手机APP访问,需要确保后端配置为: ```yaml server: port: 30091 address: 0.0.0.0 # 监听所有网络接口 ``` ### 2. 开放防火墙端口 **Windows防火墙配置** - 必须执行! ```powershell # 以管理员身份运行PowerShell: netsh advfirewall firewall add rule name="国语教育平台后端 30091" dir=in action=allow protocol=tcp localport=30091 ``` 或者通过图形界面: 1. 控制面板 → Windows Defender 防火墙 → 高级设置 2. 入站规则 → 新建规则 3. 端口 → TCP → 特定本地端口: `30091` 4. 允许连接 → 完成 ### 3. 启动后端服务 ```powershell cd D:\Desktop\Project\ry_study-v_03\ry_study-v_03\Study-Vue-redis\ry-study-admin # 使用Maven启动 mvn spring-boot:run # 或者如果已经打包成jar java -jar target/ry-study-admin.jar ``` --- ## 📱 三、移动端APP配置 ### 1. 修改APP的服务器地址配置 **文件**: `fronted_uniapp\fronted_uniapp\src\utils\config.js` **需要修改的内容**: ```javascript // 第17行:修改默认服务器地址为你的电脑IP const DEFAULT_SERVER_HOST = '192.168.137.1' // ← 修改这里 // 第18行:确认端口号 const DEFAULT_SERVER_PORT = 30091 ``` ### 2. 验证配置 修改后,APP将访问: - **API地址**: `http://192.168.137.1:30091` - **文件访问地址**: `http://192.168.137.1:30091/profile/...` --- ## 🎥 四、课件管理和视频播放说明 ### 1. 课件文件存储路径 当你通过后台管理系统上传课件时: **存储规则**: - 数据库存储的路径: `/profile/upload/2025/12/05/课件名称.mp4` - 实际物理路径: `D:\wwwroot\study_web\web\profile\upload\2025\12\05\课件名称.mp4` ### 2. 课件管理功能使用流程 #### 后台管理系统操作: 1. **登录后台管理系统** - 访问地址: `http://localhost:20002` (本地开发) - 或: `http://192.168.137.1:30091` (直接访问后端) 2. **上传课件** - 进入"教学管理" → "课件管理" - 点击"新增课件" - 选择课程、填写课件信息 - 上传视频/文档文件 - 系统会自动保存到 `D:\wwwroot\study_web\web\profile\upload\` 目录 3. **课件列表管理** - 可以查看、编辑、删除课件 - 支持按课程筛选 - 支持课件排序 #### APP端使用: 1. **查看课件列表** - 登录APP后,进入课程详情 - 可以看到该课程的所有课件列表 2. **播放视频课件** - 点击课件即可播放 - 视频URL: `http://192.168.137.1:30091/profile/upload/2025/12/05/xxx.mp4` ### 3. 视频播放访问流程 ``` APP发起请求 ↓ http://192.168.137.1:30091/profile/upload/2025/12/05/video.mp4 ↓ Spring Boot接收请求 (ResourcesConfig.java) ↓ 映射到物理路径: D:\wwwroot\study_web\web\profile\upload\2025\12\05\video.mp4 ↓ 返回视频文件流给APP ↓ APP播放器播放视频 ``` --- ## 🧪 五、测试连接是否正常 ### 1. 测试后端服务是否启动 在浏览器中访问: ``` http://192.168.137.1:30091 ``` 应该看到若依管理系统的登录页面。 ### 2. 测试文件访问是否正常 假设你已经上传了一个测试视频,可以在浏览器中直接访问: ``` http://192.168.137.1:30091/profile/upload/2025/12/05/test.mp4 ``` 如果能播放或下载,说明配置正确。 ### 3. 测试APP连接 在APP中: 1. 打开控制台/日志 2. 查看请求地址是否为: `http://192.168.137.1:30091/...` 3. 尝试登录和访问课件 4. 检查是否有网络错误 --- ## ⚠️ 六、常见问题排查 ### 问题1: APP无法连接后端 **检查清单**: - [ ] 手机和电脑在同一WiFi网络 - [ ] 防火墙已开放30091端口 - [ ] 后端服务已启动 - [ ] APP配置的IP地址正确 (192.168.137.1) **测试方法**: 在手机浏览器访问: `http://192.168.137.1:30091` ### 问题2: 视频无法播放 **检查清单**: - [ ] 文件夹权限正确(建议Everyone完全控制) - [ ] 视频文件确实存在于指定路径 - [ ] 视频格式APP支持(推荐MP4) - [ ] 文件路径没有中文或特殊字符 **测试方法**: 1. 在Windows资源管理器中找到视频文件 2. 直接双击播放确认文件完好 3. 在浏览器中访问视频URL测试 ### 问题3: 上传课件失败 **检查清单**: - [ ] 文件大小不超过2GB (application.yml配置) - [ ] 目标文件夹存在且可写 - [ ] 磁盘空间充足 --- ## 🚀 七、快速启动步骤 ### 第1步:创建文件夹 ```powershell New-Item -Path "D:\wwwroot\study_web\web\profile\upload\courseware" -ItemType Directory -Force New-Item -Path "D:\wwwroot\study_web\web\profile\upload\voice" -ItemType Directory -Force New-Item -Path "D:\wwwroot\study_web\web\profile\upload\screenshots" -ItemType Directory -Force New-Item -Path "D:\wwwroot\study_web\web\profile\upload\avatar" -ItemType Directory -Force ``` ### 第2步:开放防火墙 ```powershell netsh advfirewall firewall add rule name="国语教育平台后端 30091" dir=in action=allow protocol=tcp localport=30091 ``` ### 第3步:修改APP配置 编辑: `fronted_uniapp\fronted_uniapp\src\utils\config.js` ```javascript const DEFAULT_SERVER_HOST = '192.168.137.1' // 修改为你的IP ``` ### 第4步:启动后端 ```powershell cd Study-Vue-redis\ry-study-admin mvn spring-boot:run ``` ### 第5步:测试访问 浏览器访问: `http://192.168.137.1:30091` ### 第6步:编译和运行APP 在HBuilderX中运行APP到真机或模拟器 --- ## 📝 八、文件上传API说明 ### 通用文件上传接口 **接口地址**: `POST /common/upload` **请求方式**: `multipart/form-data` **请求参数**: - `file`: 文件对象 **返回示例**: ```json { "code": 200, "msg": "操作成功", "fileName": "/profile/upload/2025/12/05/abc123.mp4", "newFileName": "abc123.mp4", "originalFilename": "课程视频.mp4", "url": "http://192.168.137.1:30091/profile/upload/2025/12/05/abc123.mp4" } ``` ### 课件管理API **获取课件列表**: `GET /study/courseware/list` **新增课件**: `POST /study/courseware` **修改课件**: `PUT /study/courseware` **删除课件**: `DELETE /study/courseware/{id}` --- ## 🔐 九、安全建议 1. **生产环境**: 修改 `application.yml` 中的 `token.secret` 为随机32位字符串 2. **Swagger**: 生产环境设置 `swagger.enabled: false` 3. **防火墙**: 仅开放必要端口 4. **文件上传**: 设置合理的文件大小限制 5. **备份**: 定期备份 `D:\wwwroot\study_web\web\profile` 目录 --- ## 📞 附录:关键配置文件位置 ``` 项目根目录/ ├── Study-Vue-redis/ │ └── ry-study-admin/ │ └── src/main/resources/ │ └── application.yml # 后端主配置 │ └── fronted_uniapp/ └── fronted_uniapp/ └── src/utils/ └── config.js # APP服务器地址配置 ``` --- **配置完成后,你就可以**: ✅ 在后台管理系统上传和管理课件 ✅ APP端访问和播放视频课件 ✅ 语音评测功能正常使用 ✅ 屏幕监控功能正常使用