Flutter WebRTC：如何发送TTS生成的Uint8List音频数据？

要发送自定义的Uint8List音频数据到WebRTC对端，核心是创建包含该音频数据的自定义MediaStreamTrack——原生从设备获取的MediaStreamTrack无法直接写入自定义数据，必须通过音频上下文转换生成可被WebRTC识别的轨道。以下是具体实现方案：

核心逻辑 #

借助Web平台的AudioContext（Flutter Web端）将Uint8List解码为标准音频缓冲区，再通过媒体流目标节点生成自定义MediaStream，最后将对应的音频轨道添加到RTCPeerConnection中。

完整实现代码 #

替换你原有的sendTtsData方法为以下逻辑：

import 'dart:typed_data';
import 'dart:html' as html; // 仅Web平台适配，移动端需替换为对应音频处理库

Future<void> sendTtsData(Uint8List data) async {
  if (_pc == null) return;

  // 1. 将Uint8List转换为AudioContext可处理的ArrayBuffer
  final arrayBuffer = data.buffer.asByteData().buffer;

  // 2. 解码音频数据为标准音频缓冲区
  final audioContext = html.AudioContext();
  final audioBuffer = await audioContext.decodeAudioData(arrayBuffer);

  // 3. 创建媒体流目标节点，生成包含自定义音频的MediaStream
  final destination = audioContext.createMediaStreamDestination();
  final bufferSource = audioContext.createBufferSource();
  bufferSource.buffer = audioBuffer;
  bufferSource.connect(destination);

  // 4. 获取自定义音频轨道
  final customAudioTrack = destination.stream.getAudioTracks()[0];

  // 5. 移除原有音频发送者（可选：替换原有麦克风轨道）
  final senders = await _pc!.getSenders();
  for (final sender in senders) {
    if (sender.track?.kind == 'audio') {
      await _pc!.removeTrack(sender);
    }
  }

  // 6. 将自定义轨道添加到PeerConnection
  await _pc!.addTrack(customAudioTrack, destination.stream);

  // 启动音频播放，确保数据被推送到轨道
  bufferSource.start();

  notifyListeners();
}

关键注意点 #

• 平台适配：上述代码针对Flutter Web端，移动端需使用flutter_sound或audioplayers等库完成音频解码，并通过对应WebRTC插件的API生成MediaStreamTrack。
• 格式兼容性：确保TTS生成的Uint8List为浏览器支持的音频格式（如MP3、WAV），否则解码步骤会失败。
• 轨道混合：若需同时发送麦克风音频和TTS音频，需先通过音频上下文将两路音频混合，再生成新的轨道。

内容的提问来源于stack exchange，提问作者jichang