Skip to content

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是否需要临时结果booleantrue
continuous是否开启连续识别booleanfalse
vad是否开启智能静音检测booleantrue
vadThreshold静音自动停止的时间阈值 (ms)number2000
waveCount返回的波形柱数量number20

返回值

导出项说明类型
isRecording响应式录音状态Ref<boolean>
transcript已确认的转写文本Ref<string>
audioBlob录音生成的音频文件Ref<Blob>

Released under the MIT License.