基于Whisper+SparkAI+Pyttsx3实现全流程免费的语音交互

实现前后端语音交互的Demo

在现代Web应用中，语音交互越来越受到关注。它不仅能提拔用户体验，还能为特定人群提供更多便利。本文将介绍如何实现一个前后端语音交互的Demo，涵盖音频录制、语音识别、语言模子天生回复和语音合成等步调。

  
一. 项目架构

我们将使用以下技能栈：

• 前端：HTML、JavaScript
  
• 后端：Flask、Whisper语音识别模子、Pyttsx3语音合成
  
• 语音识别模子：Whisper
  
• 语言模子：星火大模子（Spark AI）
  

数据流流程图

     二. 实现流程

1. 预备工作

首先，确保你的开发环境中已经安装了以下依靠：

1. pip install torch torchaudio transformers flask flask-cors whisper pyttsx3 pydub
2. pip install --upgrade spark_ai_python

复制代码

2. 前端实现

前端重要负责音频录制和播放，并与后端举行交互。我们使用 navigator.mediaDevices.getUserMedia 举行音频录制，并使用 fetch 将录音数据发送到后端。
焦点步调

• 获取麦克风权限：
  在使用麦克风录音之前，我们需要确保欣赏器支持 navigator.mediaDevices.getUserMedia，并请求麦克风权限。如果不支持或者用户拒绝权限请求，则提示用户使用支持的欣赏器并检查权限设置。
  
  1. if (!navigator.mediaDevices || !navigator.mediaDevices.getUserMedia) {
  2.     alert('你的浏览器不支持麦克风访问，请使用支持的浏览器，如最新版本的 Chrome 或 Firefox。');
  3.     return;
  4. }

  复制代码
• 开始录音：
  获取麦克风权限后，创建一个 MediaRecorder 实例并开始录音。
  
  1. this.stream = await navigator.mediaDevices.getUserMedia({ audio: true });
  2. this.mediaRecorder = new MediaRecorder(this.stream);
  3. this.mediaRecorder.start();

  复制代码
• 制止录音并天生音频 Blob：
  当用户点击制止录音按钮时，制止录音并天生一个音频 Blob 对象，用于后续处理。
  
  1. this.mediaRecorder.addEventListener('stop', () => {
  2.     const audioBlob = new Blob(this.audioChunks, { type: 'audio/wav' });
  3.     resolve(audioBlob);
  4. });
  5. this.mediaRecorder.stop();

  复制代码
• 将音频 Blob 发送到后端：
  使用 fetch 将天生的音频 Blob 发送到后端举行处理。
  
  1. const formData = new FormData();
  2. formData.append('audio', audioBlob, 'audio.wav');
  4. fetch('/process_audio', {
  5.     method: 'POST',
  6.     body: formData
  7. })

  复制代码

3. 后端实现

后端重要负责处理前端发送的音频数据，举行语音识别和天生回复，并将回复转换为音频返回给前端。
焦点步调

• 加载 Whisper 模子：
  我们使用 Whisper 模子举行语音识别。在初始化时，加载指定的 Whisper 模子。
  
  1. model = whisper.load_model("large")

  复制代码
• 语音识别：
  吸收到前端发送的音频文件后，使用 Whisper 模子举行语音识别，提取音频中的文本。
  
  1. result = model.transcribe(audio_path, language='zh')
  2. user_text = result['text']

  复制代码
• 天生回复文本：
  将识别出的文本发送给星火大模子，天生回复文本。来此处申请相关API接口
  

• 文本转语音：
  使用 Pyttsx3 将天生的回复文本转换为语音文件。我们实现了一个 PyttsVoice 类，封装了 Pyttsx3 的使用，并处理了在 Windows 和 Linux 平台上的兼容性。
  
  
  
  
• 返回音频回复：
  将天生的语音文件读取为二进制数据，并以 JSON 格式返回给前端。
  
  1. with open(tts_path, 'rb') as f:
  2.     audio_data = f.read()
  3. return jsonify({
  4.     "transcript": user_text,
  5.     "reply": reply_text,
  6.     "audio": audio_data.hex()  # 转换音频数据为十六进制字符串
  7. })

  复制代码

配置文件

为了避免泄漏敏感信息，我们将配置项存储在 config.json 文件中，并通过 .gitignore 忽略 config.json

1. {
2.     "SPARKAI_URL": "wss://spark-api.xf-yun.com/v3.5/chat",
3.     "SPARKAI_APP_ID": "YOUR_SPARKAI_APP_ID",
4.     "SPARKAI_API_SECRET": "YOUR_SPARKAI_API_SECRET",
5.     "SPARKAI_API_KEY": "YOUR_SPARKAI_API_KEY",
6.     "SPARKAI_DOMAIN": "general"
7. }

复制代码

运行项目

确保所有依靠项已安装，后端应用可以通过以下命令启动：

1. python app.py

复制代码

前端页面可以在支持 HTTPS 的欣赏器中通过以下地点访问：

1. https://your-domain-or-ip:6123/static/index.html

复制代码

三. 踩坑点总结

• HTTPS 协议：大多数现代欣赏器只允许在 HTTPS 协议或 localhost 上使用摄像头和麦克风等硬件设备。如果你在开发环境中使用 HTTP，大概会遇到 navigator.mediaDevices 为 undefined 的题目。建议在开发和生产环境中都使用 HTTPS。你可以使用 ngrok、localhost.run 或 serveo.net 等工具将本地服务器暴露为 HTTPS 服务。
  
• 权限题目：在调用 navigator.mediaDevices.getUserMedia 时，需要处理用户拒绝权限请求的环境。可以通过捕捉错误并提示用户检查权限设置来办理。
  
• 音频格式：确保录音和处理音频数据时使用精确的格式，如 audio/wav。使用差别格式大概导致无法精确处理音频数据。
  
• 异步操作：在处理异步操作时，确保精确处理 Promise 和回调，避免因未完成的异步任务导致的数据错误。
  
• 模子选择：根据实际需求选择合适的语音识别模子。Whisper 提供了多种大小的模子，可根据资源和性能需求举行选择。对于中文语音识别，建议使用 large 模子或专门的中文识别模子。
  
• 文本转语音（TTS）服务：本文使用了 Pyttsx3 来实现文本转语音，确保了在 Windows 和 Linux 平台的兼容性。它的优点是离线运行，不需要网络毗连，但需要配置 ffmpeg 路径。
  

四. 完整代码

至此本篇博客介绍即结束，完整代码见GitHub仓库：https://github.com/YYForReal/voice-interation-demo，接待留下你的Star~

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。