WebSocket 视频流根据用户的网络状态自动调整质量

Question

我的 WebSocket 视频流有三个来源，并且我使用 JMuxer 在客户端的 Web 浏览器中显示视频。我需要根据网络状态实现自动质量调整。例如，如果当前流为 1080p，但客户端网络速度变慢，则应自动切换到 720p 源。

可用的流媒体端点有：

• /视频？质量=360p
• /视频？质量=720p
• /视频？质量=1080p

我知道网络信息 API，但我想要一个能够根据客户端处理当前数据流的能力直接调整视频质量的解决方案。

Answer 1

如果缓冲区低于设定阈值（例如 2 秒），请切换到质量较低的 WebSocket 流。如果缓冲区稳定在阈值以上，请尝试提高质量。如果可用，请使用网络信息 API 作为辅助网络速度指示器。

    let currentQuality = '/video?quality=1080p';
function switchQuality(newQuality) {
  if (currentQuality !== newQuality) {
    currentQuality = newQuality;
    websocket.close();
    initializeWebSocket(newQuality);
  }
}

function monitorBuffer() {
  setInterval(() => {
    const buffer = jmuxer.buffer.length;
    if (buffer < 2) {
      switchQuality('/video?quality=720p');
    } else if (buffer > 3 && currentQuality !== '/video?quality=1080p') {
      switchQuality('/video?quality=1080p');
    }
  }, 3000);
}