xiaozhang/guoyu

Fork 0

xiao12feng8 49cf9ecd7c 修复成功，但是无法部署到用户电脑端

2025-12-08 08:56:20 +08:00

5.3 KiB

Raw Blame History

APP 课件访问地址验证

📊 当前配置分析

1. 后端配置

文件： Study-Vue-redis/ry-study-admin/src/main/resources/application.yml

ruoyi:
  profile: D:\wwwroot\study_web\web\profile

静态资源映射：

URL: /profile/**
映射到: file:D:\wwwroot\study_web\web\profile/

2. 前端配置

文件： fronted_uniapp/utils/config.js

API_BASE_URL: http://192.168.0.106:30091
FILE_BASE_URL: http://192.168.0.106:30091/profile

3. 数据库存储

表： courseware 字段： file_path 示例值： /profile/upload/2025/11/18/xxx.mp4

4. 文件物理位置

D:\wwwroot\study_web\web\profile\upload\2025\11\18\xxx.mp4

🔄 URL 构建流程

步骤 1：从数据库读取

courseware.filePath = "/profile/upload/2025/11/18/xxx.mp4"

步骤 2：去除 /profile 前缀（避免重复）

// 代码位置：fronted_uniapp/pages/course/detail.vue:460
if (filePath.startsWith('/profile/')) {
    filePath = filePath.substring(8)  // 去掉 '/profile'
}
// 结果：filePath = "/upload/2025/11/18/xxx.mp4"

步骤 3：对文件名进行 URL 编码

// 代码位置：fronted_uniapp/pages/course/detail.vue:474
const pathParts = filePath.split('/')
const encodedPath = pathParts.map((part, index) => {
    if (index === pathParts.length - 1) {
        return encodeURIComponent(part)  // 只编码文件名
    }
    return part
}).join('/')
// 结果：encodedPath = "/upload/2025/11/18/xxx.mp4"

步骤 4：拼接完整 URL

// 代码位置：fronted_uniapp/pages/course/detail.vue:486
const fileUrl = config.FILE_BASE_URL + encodedPath
// 结果：fileUrl = "http://192.168.0.106:30091/profile/upload/2025/11/18/xxx.mp4"

✅ 验证结果

完整的访问路径：

1. 数据库路径：/profile/upload/2025/11/18/xxx.mp4
2. 去除前缀后：/upload/2025/11/18/xxx.mp4
3. 拼接 FILE_BASE_URL：http://192.168.0.106:30091/profile/upload/2025/11/18/xxx.mp4
4. 后端映射：/profile/** → D:\wwwroot\study_web\web\profile/
5. 最终物理路径：D:\wwwroot\study_web\web\profile/upload/2025/11/18/xxx.mp4

✅ 路径匹配正确！

🧪 测试验证

测试 1：直接访问 URL

在浏览器中访问：

http://192.168.0.106:30091/profile/upload/2025/11/18/xxx.mp4

预期结果： 视频可以正常播放

测试 2：在 APP 中播放

打开课程详情页
点击播放视频
查看控制台日志

预期日志：

[课程学习] 🔗 URL构建信息:
  - FILE_BASE_URL: http://192.168.0.106:30091/profile
  - 原始filePath: /profile/upload/2025/11/18/xxx.mp4
  - 编码后路径: /upload/2025/11/18/xxx.mp4
  - 完整URL: http://192.168.0.106:30091/profile/upload/2025/11/18/xxx.mp4

🔍 可能的问题和解决方案

问题 1：视频无法加载（404）

检查清单：

文件是否存在于物理路径
后端服务是否启动
防火墙是否开放 30091 端口
手机和电脑是否在同一局域网

解决方法：

# 检查文件是否存在
dir "D:\wwwroot\study_web\web\profile\upload\2025\11\18"

# 检查后端服务
netstat -ano | findstr 30091

问题 2：中文文件名乱码

原因： URL 编码问题

解决： 代码已经处理了文件名编码

// 只对文件名进行 encodeURIComponent
if (index === pathParts.length - 1) {
    return encodeURIComponent(part)
}

问题 3：路径重复（/profile/profile/）

原因： 数据库中的路径已包含 /profile/，前端又拼接了一次

解决： 代码已经处理了前缀去除

if (filePath.startsWith('/profile/')) {
    filePath = filePath.substring(8)  // 去掉 '/profile'
}

📝 配置总结

✅ 当前配置正确

配置项	值	状态
后端端口	30091	✅
后端 profile 路径	D:\wwwroot\study_web\web\profile	✅
前端 API 地址	http://192.168.0.106:30091	✅
前端 FILE_BASE_URL	http://192.168.0.106:30091/profile	✅
数据库路径格式	/profile/upload/2025/11/18/xxx.mp4	✅
文件物理位置	D:\wwwroot\study_web\web\profile\upload\2025\11\18\xxx.mp4	✅

✅ URL 构建逻辑正确

代码已经正确处理了：

✅ 去除重复的 /profile/ 前缀
✅ 对文件名进行 URL 编码
✅ 拼接完整的访问 URL
✅ 路径映射正确

🎯 结论

APP 课件访问地址配置完全正确！ ✅

所有配置都已经正确设置，URL 构建逻辑也处理了各种边界情况：

去除重复前缀
文件名编码
路径规范化

现在可以放心打包 APP 了！

📱 打包建议

打包前检查清单：

后端配置正确
前端配置正确
数据库路径正确
文件已迁移到正确位置
URL 构建逻辑正确
后端服务正常运行
测试视频可以正常访问

打包方式：

使用 云端打包 来编译 UTS 插件（语音识别功能）：

发行 → 原生App-云打包 → 勾选"打包为自定义调试基座"

或者打正式包：

发行 → 原生App-云打包 → 不勾选"打包为自定义调试基座"

5.3 KiB Raw Blame History Unescape Escape