如何保持WebRTC数据通道打开在手机浏览器非活动选项卡

How to keep WebRTC dataChannel open in phone browser inactive tab?

本文关键字:浏览器 手机 非活动 选项 何保持 WebRTC 数据通道      更新时间:2023-09-26

我正在制作一个使用WebRTC的web应用程序。它在桌面浏览器上运行良好。然而,在小型智能手机web浏览器上,存在不需要的事件:

当切换移动web浏览器chrome for android和firefox for android的选项卡时,使用.createDataChannel创建的一个开放的webrtc数据通道关闭。触发dataChannel.onclose事件处理程序。如何防止数据通道关闭?如果不可能,是否可以重新打开数据通道而不重新启动整个信令阶段?

当使用<input type="file">

浏览文件时也会发生这种情况

我浏览了一下stackoverflow,注意到在requestTimeOutsetInterval等非活动选项卡中还有其他东西被削减/减慢。

是否需要任何授权来强制它在后台保持打开状态

强制浏览器在后台保持选项卡完全活动的一种方法是使用Web Audio API。实际上,任何播放声音的应用程序(例如音乐播放器)都需要保持活力,这是有道理的。但是,这是一个非标准的黑客,因此不是未来的证明。如果你碰巧找到了其他的方法,那就分享你的知识吧。

根据mozilla的webRTC文档。

处理通道状态变化

我们的本地和远程对等端都使用一个方法来处理指示通道连接状态变化的事件。

当本地对等体经历打开或关闭事件时,调用handleSendChannelStatusChange()方法:

function handleSendChannelStatusChange(event) {
if (sendChannel) {
  var state = sendChannel.readyState;
  if (state === "open") {
    messageInputBox.disabled = false;
    messageInputBox.focus();
    sendButton.disabled = false;
    disconnectButton.disabled = false;
    connectButton.disabled = true;
  } else {
    messageInputBox.disabled = true;
    sendButton.disabled = true;
    connectButton.disabled = false;
    disconnectButton.disabled = true;
  }
}

}

如果通道的状态变为"open",则表示我们已经完成了两个对等体之间的链路建立。用户界面相应更新:启用消息发送的文本输入框,聚焦输入框以便用户可以立即开始键入,启用"发送"answers"断开"按钮,现在它们可用,并禁用"连接"按钮,因为当连接打开时不需要它。

如果状态变为"关闭",则会发生相反的操作:输入框和"发送"按钮被禁用,"连接"按钮被启用,以便用户可以打开一个新的连接,如果他们希望这样做,"断开"按钮被禁用,因为当没有连接存在时它是无用的。

所以尝试使用handleReceiveChannelStatusChange
另一方面,这个示例远程对等体忽略状态更改事件,除了将事件记录到控制台:

function handleReceiveChannelStatusChange(event) {
      if (receiveChannel) {
               console.log("Receive channel's status has changed to " +
               receiveChannel.readyState);
   }
 }

handleReceiveChannelStatusChange()方法接收发生的事件作为输入参数;这将是一个RTCDataChannelEvent