如何在 iOS Safari 上使用 Daily.co 录制麦克风同时进行视频通话

Posted 2023-03-27

【中文标题】如何在 iOS Safari 上使用 Daily.co 录制麦克风同时进行视频通话

【英文标题】：How to record mic WHILE video calling with Daily.co on iOS Safari

【发布时间】：2021-09-14 16:47:05

【问题描述】：

问题

使用 iPad 的 ios Safari，我可以使用 Daily.co's video API 呼叫其他设备。但是，当我开始通过 audio-recorder-polyfill library 录制本地麦克风时，其他人将不再能够听到我的声音，即使我仍然可以听到他们的声音并分享我的相机。即使录音会话结束，音频通话仍然中断（尽管录音机工作正常）。

这似乎是 iOS 特有的，因为我的 Surface 的 Windows Chrome 没有问题。

如何重现

大约需要 2 分钟

使用 iPad Safari 和任何其他设备访问 explain.mit.edu。按绿色通话按钮。 确认视频通话正常后，按下 iPad 上的录制按钮 请注意，其他设备无法再听到任何声音

我尝试了什么

首先，我猜测 MediaRecorder 会使 Daily 视频通话对麦克风的访问无效，因此我使用 setLocalDevice 每 5 秒重新指定对 Daily 的访问，看看会发生什么。在录制过程中没有任何区别，但是当录制结束时，它确实恢复了音频通话。

所以剩下的问题是音频调用流在录制过程中不起作用：我阅读了有关 MediaCapture API 的 MDN 文档，它提到流具有一个输入和一个输出，但我不知道这究竟意味着什么，以及两个“事物”是否可以同时访问一个麦克风流。

相关代码

我只使用 Daily 和 audio-recorder-polyfill 提供的基本最低 API

视频通话 (full code here)

await this.CallObject.join(
  url: conferenceRoom.url,
  userName: this.sessionID
); 

录音 (full code here)

const stream = await navigator.mediaDevices.getUserMedia( audio: true );
this.recorder = new MediaRecorder(stream); 
this.recorder.start(); 

我不认为这个问题是由其他地方引起的，但如果需要，here's the full repository code

真实环境 对于上下文，我在 https://explain.mit.edu 工作。你去那里寻求帮助，然后其他人会到达并使用实时黑板和语音聊天向你解释一些事情 - 并且作为副产品制作了 KhanAcademy 视频。但是现在如果有人按“录音”，语音聊天就会停止工作。

【问题讨论】：

目前正在尝试克隆 MediaStream：developer.mozilla.org/en-US/docs/Web/API/MediaStream/clone

更新：成功了。我初始化了两个独立的流。我将一个传递给 Daily（请注意，您必须打开 MediaStream 才能获得真正的 MediaStream），另一个用于录制目的（特别是对我而言，每次开始新录制时，我还会制作另一个副本，因此每个录制会话都是独立的，但这与这个问题不太相关）

【参考方案1】：

我们可以为此制作一个复制案例，但我猜会发生什么。 iOS Safari 过去在任何时候调用getUserMedia() 时都会停止来自本地麦克风/摄像头的任何当前曲目。因此，与桌面浏览器和 android Chrome 不同，在 iOS 上您不能请求或使用多个流。

iOS Safari 是一个移动的目标，我最近没有关注这个特定的问题。但如果是这样的话，也许你可以通过一个相当小的代码更改来解决它。

代替：

const stream = await navigator.mediaDevices.getUserMedia( audio: true );

您可以从 Daily call 对象中获取本地音轨并从中制作流：

const track = this.callObject.participants().local.tracks.audio.persistentTrack
if (!track) 
  throw new Error("can't start recording right now ... no audio track");

this.recorder = new MediaRecorder(new MediaStream([track]));
this.recorder.start();

【讨论】：

非常感谢！我还从贵公司的实时聊天中获得了支持（他们建议将曲目克隆到 Daily，另一个克隆到录音机……我将暂时坚持使用该解决方案，以便即使我也可以录制视频我不在通话中，但这个解释帮助我理解了实际​​发生的事情。总的来说，非常感谢你的帮助:)