
CopilotKit Agno 集成语音示例音频 sample.wav 配置与生成完全指南【免费下载链接】CopilotKitThe Frontend Stack for Agents Generative UI. React, Angular, Mobile, Slack, and more. Makers of the AG-UI Protocol项目地址: https://gitcode.com/GitHub_Trending/co/CopilotKit本指南围绕 CopilotKit 仓库中 Agno 集成showcase/integrations/agno的语音演示Voice Demo展开核心目标是教会你如何正确放置并生成驱动该演示的示例音频文件sample.wav。读完本文你将掌握该音频文件的目录位置、格式规格16kHz 单声道、3–5 秒、小于 100KB、内容要求必须包含 What is the weather in Tokyo? 这句台词以及 macOS / Linux / Windows 三平台的标准生成命令并理解该文件在语音转写链路/transcribe端点、E2E 断言中的真实作用。一、这份 README 说明文档的用途语音演示的固定台词音频在仓库路径 showcase/integrations/agno/public/demo-audio/README.md 下存放着一份专门解释语音演示音频文件的说明文档。它对应的是 Agno 集成中的Voice Input语音输入演示在 manifest.yaml 中被登记为id: voice路由为/demos/voice其功能描述为Microphone sample-audio button → /transcribe endpoint → text injected into the chat composer麦克风 示例音频按钮 →/transcribe端点 → 文本注入聊天输入框该演示页面同时提供两条输入通道详见 voice-chat.tsx 的注释麦克风按钮由CopilotChat /在运行时runtime通告audioFileTranscriptionEnabled: true时渲染点击后录音并调用真正的转写端点示例音频按钮Sample Audio Button同步将一段预设台词注入聊天输入框不依赖麦克风权限也不走/transcribe往返是确定性的测试/演示手段。本 README 说明文档所管理的sample.wav正是为了让上述示例音频路径在不需要麦克风权限的前提下完整复现语音 → 文本 → Agent 应答的链路演示页面会在客户端取用该音频文件并将其 POST 到转写端点。二、文件放置位置与命名约定说明文档明确规定将一个小体积小于 100KB的 WAV 文件放在本目录showcase/integrations/agno/public/demo-audio/文件必须命名为sample.wav当前仓库中该目录实际已存在 sample.wav与 README 约定的命名一致。该目录位于 Agno 集成的 Next.jspublic/静态资源目录下因此客户端可以直接通过 URL 访问并获取该音频文件。为什么放在public/demo-audio/从 manifest.yaml 中可以看到public/目录还包含demo-files/用于 Multimodal 附件演示说明public/承担着为各演示提供静态样例资源音频、文件附件等的统一职责。sample.wav作为语音演示的客户端样例音频被归类于此。三、音频内容要求一句固定台词为什么这么关键说明文档明确要求音频内容必须是一段朗读What is the weather in Tokyo?的语音片段。这个要求并非随意而是由演示的端到端验证链决定的演示页面会向用户展示这句台词在 voice-chat.tsx 中定义了const SAMPLE_TEXT What is the weather in Tokyo?;并作为示例音频按钮的 tooltip 提示见 sample-audio-button.tsx。用户看到页面后按图索骥理应能听到同一句话。E2E 测试会断言转写文本包含关键词在 voice.spec.ts 中Playwright 测试断言textarea的值匹配正则/weather|tokyo/i。也就是说只要转写结果或示例按钮注入的固定文本中包含 weather 或 Tokyo测试即通过。QA 检查清单与测试套件共用同一台词说明文档指出bundled QA checklist E2E spec都依赖这段台词来断言转写结果。因此如果音频内容与页面广告的台词不一致即使音频本身能正常转写验证流程也无法通过。四、三平台生成命令从朗读到 16kHz 单声道 WAV说明文档为三种主流开发平台分别给出了生成命令。下面逐条展开并补充参数说明。macOSsay ffmpeg 两步转换say -o sample.aiff What is the weather in Tokyo? ffmpeg -i sample.aiff -ar 16000 -ac 1 sample.wavsay -o sample.aiff调用 macOS 系统自带文本朗读引擎将文本合成为 AIFF 格式音频ffmpeg -i sample.aiff -ar 16000 -ac 1 sample.wav将 AIFF 转码为 WAV同时完成两项关键规格转换-ar 16000采样率设为 16kHz转写服务的标准输入采样率-ac 1强制单声道。Linuxespeak-ng 一步直达espeak-ng -w sample.wav What is the weather in Tokyo?espeak-ng是 Linux 上常用的开源文本转语音TTS工具-w参数直接输出 WAV 文件。若系统未安装可通过发行版包管理器安装如apt install espeak-ng。注意espeak-ng 生成的默认 WAV 通常已是 16kHz 单声道但为保险起见可以同样通过ffmpeg校验或强制转换规格见下文规格自查。WindowsPowerShell 系统语音合成Add-Type -AssemblyName System.Speech $synth New-Object System.Speech.Synthesis.SpeechSynthesizer $synth.SetOutputToWaveFile(sample.wav) $synth.Speak(What is the weather in Tokyo?) $synth.Dispose()说明文档给出的核心 API 是 .NET 的System.Speech.Synthesis.SpeechSynthesizer配合SetOutputToWaveFile上述 PowerShell 脚本即为该 API 的完整落地写法。五、目标规格为什么是 16kHz 单声道 3–5 秒 100KB说明文档给出的最终规格目标规格项目标值原因分析采样率16kHz语音识别模型的标准输入采样率与转写服务兼容声道单声道mono语音识别通常只需要单声道减小体积时长3–5 秒What is the weather in Tokyo? 正常语速朗读的时长区间过短会截断内容过长会撑大文件体积文件大小小于 100KB保证客户端快速获取、转写接口请求体轻量为什么是 100KB这与该演示无需麦克风权限的定位直接相关音频需要在客户端被取用并 POST 到转写端点见说明文档与 route.ts 注释中提到的/transcribe端点。过大的文件会让该链路变得缓慢甚至不可用因此 README 明确将 100KB 作为硬性上限。自查建议生成后可用ffprobeffmpeg 套件自带验证规格ffprobe -v error -show_entries streamsample_rate,channels -of defaultnoprint_wrappers1 sample.wav以及查看文件大小ls -la sample.wav若采样率/声道不符或超过 100KB按需用ffmpeg -i in.wav -ar 16000 -ac 1 out.wav重新转换。六、源码级佐证sample.wav 在转写链路中的真实角色将说明文档与仓库源码对照可以还原这条完整的链路1. 转写端点服务端语音演示使用了一个专门的 CopilotRuntime 路由showcase/integrations/agno/src/app/api/copilotkit-voice/[[...slug]]/route.ts。该路由的实现目标见文件头注释包括在/info上通告audioFileTranscriptionEnabled: true让聊天输入框渲染出麦克风按钮处理POST /transcribe调用 OpenAI 支持的TranscriptionServiceOpenAI来自copilotkit/voice包当OPENAI_API_KEY未配置时返回类型化的 401 错误而不是 5xx。其中GuardedOpenAITranscriptionService类第 33–54 行封装了密钥守卫逻辑若未设置OPENAI_API_KEYtranscribeFile会抛出包含 api key 子串的错误该错误会被映射为AUTH_FAILED→ 401。也就是说要真正跑通上传 WAV → 转写为文本必须为部署环境配置OPENAI_API_KEY否则音频文件即使放置正确转写也会返回 401。2. 客户端取用与按钮注入前端演示页面 page.tsx 通过CopilotKit runtimeUrl/api/copilotkit-voice agentvoice-demo useSingleEndpoint{false} enableInspector{false}挂载语音专用运行时voice-chat.tsx 中的handleTranscribed通过 DOM 操作原生 value setter 触发input事件将文本注入data-testidcopilot-chat-textarea这是绕过CopilotChat内部受控状态的 React 兼容做法sample-audio-button.tsx 提供data-testidvoice-sample-audio-button的按钮点击后同步调用onTranscribed(sampleText)。其注释明确指出该按钮是纯粹的测试/演示辅助手段不涉及麦克风权限、不获取音频、不经过/transcribe往返。3. E2E 测试验证端到端voice.spec.ts 中的三个测试分别覆盖页面加载第 23–44 行断言标题 Voice input、示例音频按钮、聊天输入框可见并断言麦克风按钮copilot-start-transcribe-button最终出现——该按钮的出现证明运行时通告了audioFileTranscriptionEnabled: true示例按钮注入第 46–63 行点击按钮后textarea 在 1 秒内匹配/weather|tokyo/i且无瞬态 Transcribing… 状态、无/transcribe往返发送后产生 Agent 响应第 65–98 行发送文本后等待天气卡片weather-card或通用 catchall 卡片custom-catchall-card[data-tool-nameget_weather]或 assistant 消息出现断言某种 agent 响应面已呈现。测试头部注释还说明了设计取舍麦克风路径真实的转写不在 E2E 范围内因为MediaRecorder在无头环境中难以稳定驱动真实的转写路径改由qa/目录下的人工 QA 清单覆盖示例音频按钮路径则保证 Playwright 测试不依赖转写端点健康状态或特定 aimock fixture。这也解释了为什么说明文档要把sample.wav的内容限定为固定台词——它是整个确定性验证体系的一部分。七、常见问题排查现象可能原因处理方式目录中缺少sample.wav或命名不符未放置或命名错误严格命名为sample.wav并放入showcase/integrations/agno/public/demo-audio/音频内容不是 What is the weather in Tokyo?使用了自定义文本按文档生成标准台词否则 E2E/QA 断言无法通过文件超过 100KB采样率过高、立体声或时长过长用ffmpeg -ar 16000 -ac 1重编码并缩短时长点击麦克风后转写报错/返回 401未配置OPENAI_API_KEY在部署环境设置OPENAI_API_KEY参见 route.ts 的守卫逻辑E2E 测试无法点击示例按钮本地开发时 web-inspector 覆盖层拦截点击演示页面已显式enableInspector{false}以保持两环境行为一致见 page.tsx八、小结showcase/integrations/agno/public/demo-audio/README.md看似只是一段简短的资源放置说明但在 CopilotKit Agno 集成的语音演示体系中它承载着确定性验证的关键职责固定的文件名、固定的台词、固定的音频规格与voice-demo专用运行时/api/copilotkit-voice、示例音频按钮组件以及 Playwright E2E 测试共同构成了一条不依赖麦克风权限即可端到端演示语音输入 → 转写 → Agent 应答的稳定链路。按本文提供的三平台命令生成合规的sample.wav即可让该演示在任何环境中稳定复现。【免费下载链接】CopilotKitThe Frontend Stack for Agents Generative UI. React, Angular, Mobile, Slack, and more. Makers of the AG-UI Protocol项目地址: https://gitcode.com/GitHub_Trending/co/CopilotKit创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考