优化后台前端视频流问题

yanjinhui

2025-11-14 920390be74afb8a585fa0fc2a1359ecb52b1c5af

 ÏîÄ¿´úÂë/Ç°¶Ë/ºǫ́/src/views/tts/PickAndDrop/PickAndDrop.vue

@@ -858,6 +858,10 @@

  rstp.value=srtpaddres[tab.index].left
  rstp1.value=srtpaddres[tab.index].right
   // æ·»åŠ å»¶è¿Ÿç¡®ä¿æ–°æ ‡ç­¾é¡µå®Œå…¨æ¸²æŸ“
  nextTick(() => {
    initVideo();
  });
}

//视频监控
@@ -867,18 +871,28 @@
const initVideo = () => {
  destroyVideo()// å®‰å…¨æ¸…理
  try {
    webRtcServer_left.value = new WebRtcStreamer('video_left', serverUrl)
    webRtcServer_left.value.connect(rstp.value)
    // æ·»åŠ å»¶è¿Ÿç¡®ä¿DOM已渲染
    nextTick(() => {
      const videoLeft = document.getElementById('video_left');
      const videoRight = document.getElementById('video_right');
      
      if (!videoLeft || !videoRight) {
        console.error('Video elements not found');
        return;
      }

    webRtcServer_right.value = new WebRtcStreamer('video_right', serverUrl)
    webRtcServer_right.value.connect(rstp1.value)
      webRtcServer_left.value = new WebRtcStreamer('video_left', serverUrl)
      webRtcServer_left.value.connect(rstp.value)

    console.log('视频初始化完成')
      webRtcServer_right.value = new WebRtcStreamer('video_right', serverUrl)
      webRtcServer_right.value.connect(rstp1.value)

      console.log('视频初始化完成')
    });
  } catch (err) {
    ElMessage.error('视频初始化失败: ' + err.message)
  }
}

//销毁视频函数
const destroyVideo = () => {
  if (webRtcServer_left.value) {