useAiVoice 语音交互
浏览器兼容性
调用浏览器原生的语音识别 API,在 谷歌浏览器 中使用,需要在 🪄 魔法环境 中才能正常使用。
useAiVoice 是一个高度集成的语音处理 Hook。它不仅封装了浏览器原生的语音转文字(STT)能力,还内置了 Web Audio 分析引擎,能够实时输出高频波形数据,完美配合 AiVoiceTrigger 组件实现动感视觉反馈。
核心特性
- 视觉同步:内置频率分析器,实时返回
amplitudes数组,直接驱动波形动画。 - 物理录制:内置
MediaRecorder,录音结束后自动生成.webm音频 Blob。 - 智能 VAD:支持静音检测(Voice Activity Detection),用户停止说话后自动结束录音。
- 实时转写:支持
interimResults,在说话过程中即可获取部分识别结果。 - 即插即用:自动管理麦克风权限、AudioContext 生命周期及销毁逻辑。
基础用法
⚠️ 当前环境不支持 Web Speech API(建议使用 Chrome 并开启魔法)
等待发言...
基础交互演示
结合 AiSender 使用
将语音触发器集成到 AiSender 中,实现类似于主流 AI 助手的输入体验。
集成输入框
进阶方案:拟物化 AI 对话
全流程语音对话
API
UseAiVoiceOptions
| 属性名 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| language | 识别语言 | string | 'zh-CN' |
| interimResults | 是否需要临时结果 | boolean | true |
| continuous | 是否开启连续识别 | boolean | false |
| vad | 是否开启智能静音检测 | boolean | true |
| vadThreshold | 静音自动停止的时间阈值 (ms) | number | 2000 |
| waveCount | 返回的波形柱数量 | number | 20 |
返回值
| 导出项 | 说明 | 类型 |
|---|---|---|
| isRecording | 响应式录音状态 | Ref<boolean> |
| transcript | 已确认的转写文本 | Ref<string> |
| audioBlob | 录音生成的音频文件 | Ref<Blob> |