173 lines
4.3 KiB
Markdown
173 lines
4.3 KiB
Markdown
# Windows 视频路径修复验证
|
||
|
||
## 🐛 问题分析
|
||
|
||
### 原始错误
|
||
```
|
||
convertFileSrc C:\Users\imeep\.mixvideo\temp\video_segments\478e3974-5710-4521-8076-89b09eed2971.mp4
|
||
转换后URL: http://asset.localhost/C%3A%5CUsers%5Cimeep%5C.mixvideo%5Ctemp%5Cvideo_segments%5C478e3974-5710-4521-8076-89b09eed2971.mp4
|
||
结果: convertFileSrc method failed - video error
|
||
```
|
||
|
||
### 问题根源
|
||
1. **Windows绝对路径**: `C:\Users\...` 格式
|
||
2. **URL编码问题**: `C:` → `C%3A`, `\` → `%5C`
|
||
3. **Tauri asset protocol**: 不支持这种编码后的Windows路径格式
|
||
|
||
## 🔧 修复方案
|
||
|
||
### 1. **路径检测机制**
|
||
```typescript
|
||
const isWindowsAbsolutePath = (path: string): boolean => {
|
||
return /^[A-Z]:\\/i.test(path) || path.includes('\\')
|
||
}
|
||
```
|
||
|
||
### 2. **分层加载策略**
|
||
|
||
#### Windows路径加载顺序:
|
||
```
|
||
1. dataUrl 方法 (read_video_as_data_url)
|
||
↓ 失败时
|
||
2. convertFileSrc 方法 (原始路径)
|
||
↓ 失败时
|
||
3. normalizedPath 方法 (路径标准化)
|
||
```
|
||
|
||
#### 非Windows路径加载顺序:
|
||
```
|
||
1. convertFileSrc 方法 (推荐)
|
||
↓ 失败时
|
||
2. dataUrl 方法 (备用)
|
||
```
|
||
|
||
### 3. **核心改进**
|
||
|
||
#### A. 智能路径检测
|
||
```typescript
|
||
const isWindowsPath = isWindowsAbsolutePath(path)
|
||
const methods = isWindowsPath ? windowsMethods : unixMethods
|
||
```
|
||
|
||
#### B. Windows优先使用data URL
|
||
```typescript
|
||
// Windows路径优先使用后端读取
|
||
{
|
||
name: 'dataUrl',
|
||
load: async () => {
|
||
const dataUrl = await invoke<string>('read_video_as_data_url', { filePath: path })
|
||
return dataUrl
|
||
}
|
||
}
|
||
```
|
||
|
||
#### C. 路径标准化备用方案
|
||
```typescript
|
||
{
|
||
name: 'normalizedPath',
|
||
load: () => {
|
||
const normalizedPath = path.replace(/\\/g, '/')
|
||
return convertFileSrc(normalizedPath)
|
||
}
|
||
}
|
||
```
|
||
|
||
## ✅ 预期修复效果
|
||
|
||
### 1. **Windows路径处理**
|
||
- ✅ 自动检测Windows绝对路径
|
||
- ✅ 优先使用data URL方法绕过路径编码问题
|
||
- ✅ 提供多种备用加载方案
|
||
|
||
### 2. **兼容性保证**
|
||
- ✅ 非Windows路径保持原有逻辑
|
||
- ✅ 向后兼容现有功能
|
||
- ✅ 错误处理机制完善
|
||
|
||
### 3. **用户体验**
|
||
- ✅ 自动选择最佳加载方法
|
||
- ✅ 详细的调试日志
|
||
- ✅ 友好的错误提示
|
||
|
||
## 🧪 测试验证
|
||
|
||
### 1. **测试用例**
|
||
|
||
#### Windows路径测试:
|
||
```
|
||
路径: C:\Users\imeep\.mixvideo\temp\video_segments\test.mp4
|
||
预期: 使用data URL方法成功加载
|
||
```
|
||
|
||
#### Unix路径测试:
|
||
```
|
||
路径: /home/user/.mixvideo/temp/video_segments/test.mp4
|
||
预期: 使用convertFileSrc方法成功加载
|
||
```
|
||
|
||
### 2. **验证步骤**
|
||
1. 打开项目详情页面
|
||
2. 点击视频素材播放按钮
|
||
3. 观察控制台日志:
|
||
- 应该显示路径检测结果
|
||
- 应该显示选择的加载方法
|
||
- 应该显示加载成功或失败信息
|
||
|
||
### 3. **成功标志**
|
||
- ✅ 不再出现 `convertFileSrc method failed` 错误
|
||
- ✅ Windows路径视频可以正常播放
|
||
- ✅ 控制台显示正确的加载方法选择
|
||
|
||
## 🔍 故障排除
|
||
|
||
### 1. **如果data URL方法失败**
|
||
```
|
||
检查项目:
|
||
- 文件是否存在
|
||
- 文件是否过大 (>50MB可能导致内存问题)
|
||
- 文件格式是否支持
|
||
```
|
||
|
||
### 2. **如果所有方法都失败**
|
||
```
|
||
可能原因:
|
||
- 文件损坏
|
||
- 权限问题
|
||
- 不支持的视频格式
|
||
- Tauri配置问题
|
||
```
|
||
|
||
### 3. **调试建议**
|
||
```typescript
|
||
// 在控制台查看详细信息
|
||
console.log('Path type:', isWindowsAbsolutePath(path))
|
||
console.log('Selected methods:', methods.map(m => m.name))
|
||
console.log('File exists:', await invoke('check_file_exists', { filePath: path }))
|
||
```
|
||
|
||
## 📊 性能考虑
|
||
|
||
### 1. **data URL方法**
|
||
- **优点**: 绕过路径编码问题,兼容性好
|
||
- **缺点**: 内存占用大,加载时间长
|
||
- **适用**: 小到中等大小的视频文件 (<50MB)
|
||
|
||
### 2. **convertFileSrc方法**
|
||
- **优点**: 性能好,内存占用小
|
||
- **缺点**: 路径编码问题
|
||
- **适用**: 标准路径格式的文件
|
||
|
||
### 3. **优化建议**
|
||
- 对于大文件,优先尝试convertFileSrc
|
||
- 对于Windows路径,优先使用data URL
|
||
- 实现文件大小检测,动态选择方法
|
||
|
||
## 🎯 总结
|
||
|
||
这个修复方案通过:
|
||
1. **智能路径检测** - 自动识别Windows vs Unix路径
|
||
2. **分层加载策略** - 针对不同路径类型使用最佳方法
|
||
3. **完善错误处理** - 多种备用方案确保成功率
|
||
|
||
应该能够解决Windows路径下的视频播放问题,同时保持对其他平台的兼容性。
|