Initial commit: restore project after Git corruption
This commit is contained in:
108
web/src/apps/muse/videos/store/README.md
Normal file
108
web/src/apps/muse/videos/store/README.md
Normal file
@@ -0,0 +1,108 @@
|
||||
# Voice Store 使用说明
|
||||
|
||||
这个 Zustand store 管理语音记录列表,实现了以下功能:
|
||||
|
||||
## 主要特性
|
||||
|
||||
1. **本地存储**: 使用 IndexedDB 永久保存语音数据
|
||||
2. **当天记录**: 自动获取和过滤当天的语音记录
|
||||
3. **音频 URL 管理**: 将 base64 数据转换为 Blob URL 供播放使用
|
||||
4. **不保存 URL**: 保存时不存储 URL 地址,避免无效引用
|
||||
5. **自动清理**: 页面卸载时自动释放 Blob URL 资源
|
||||
|
||||
## 使用方法
|
||||
|
||||
### 基本使用
|
||||
|
||||
```typescript
|
||||
import { useVoiceStore } from '../store/voiceStore';
|
||||
|
||||
const MyComponent = () => {
|
||||
const {
|
||||
voiceList,
|
||||
isLoading,
|
||||
error,
|
||||
initialize,
|
||||
addVoice,
|
||||
updateVoice,
|
||||
deleteVoice
|
||||
} = useVoiceStore();
|
||||
|
||||
// 初始化(通常在组件挂载时调用)
|
||||
useEffect(() => {
|
||||
initialize();
|
||||
}, [initialize]);
|
||||
|
||||
// ... 组件逻辑
|
||||
};
|
||||
```
|
||||
|
||||
### 添加语音记录
|
||||
|
||||
```typescript
|
||||
// 通过 Blob 添加(推荐方式)
|
||||
const audioBlob = new Blob([wavBuffer], { type: 'audio/wav' });
|
||||
const newRecord = await addVoice(temporaryUrl, duration, audioBlob);
|
||||
|
||||
// 仅通过 URL 添加
|
||||
const newRecord = await addVoice(url, duration);
|
||||
```
|
||||
|
||||
### 更新记录
|
||||
|
||||
```typescript
|
||||
await updateVoice(recordId, {
|
||||
text: "识别的文字内容",
|
||||
speaker: "说话人名称"
|
||||
});
|
||||
```
|
||||
|
||||
### 删除记录
|
||||
|
||||
```typescript
|
||||
await deleteVoice(recordId);
|
||||
```
|
||||
|
||||
## 数据流程
|
||||
|
||||
1. **初始化**: `initialize()` 从 IndexedDB 获取当天记录
|
||||
2. **生成 URL**: 为每条记录的 base64 数据生成 Blob URL
|
||||
3. **添加记录**: `addVoice()` 将音频转为 base64 保存到 IndexedDB
|
||||
4. **播放**: 组件使用生成的 Blob URL 播放音频
|
||||
5. **清理**: 页面卸载时释放所有 Blob URL
|
||||
|
||||
## 存储策略
|
||||
|
||||
- **IndexedDB**: 存储 base64 编码的音频数据、文本、元数据
|
||||
- **内存**: 临时存储 Blob URL 用于播放
|
||||
- **不存储**: URL 地址不会保存到 IndexedDB
|
||||
|
||||
## 注意事项
|
||||
|
||||
1. Blob URL 仅在当前会话有效,刷新页面后会重新生成
|
||||
2. 大量语音记录可能占用较多内存,建议定期清理旧记录
|
||||
3. 初始化时会自动过滤当天记录,跨天使用需要重新初始化
|
||||
4. 组件卸载时会自动清理资源,无需手动管理
|
||||
|
||||
## 错误处理
|
||||
|
||||
Store 提供了错误状态管理:
|
||||
|
||||
```typescript
|
||||
const { error, setError } = useVoiceStore();
|
||||
|
||||
// 检查错误状态
|
||||
if (error) {
|
||||
console.error('语音操作失败:', error);
|
||||
}
|
||||
|
||||
// 清除错误
|
||||
setError(null);
|
||||
```
|
||||
|
||||
## 性能优化
|
||||
|
||||
- 使用 Zustand 的 devtools 进行调试
|
||||
- Blob URL 按需生成,避免内存浪费
|
||||
- IndexedDB 操作异步执行,不阻塞 UI
|
||||
- 批量操作支持,提高大量数据处理效率
|
||||
Reference in New Issue
Block a user