预警详情通话调试

src/features/invigilation/RealtimeMonitoring/ExamBatchDialog.vue

@@ -48,6 +48,7 @@ export default {
     ...mapMutations("invigilation", ["setSelectedExamId"]),
     async getExamList() {
       const res = await examMonitorBatchList({
+        type: "monitor",
         userId: this.userId,
         pageNumber: 1,
         pageSize: 100,

src/features/invigilation/RealtimeMonitoring/VideoCommunication.vue

@@ -117,6 +117,12 @@ import {
 import SecondTimer from "../common/SecondTimer";
 import { formatDate, timeNumberToText } from "@/utils/utils";
 
+const domEmpty = (dom) => {
+  dom.childNodes.forEach((childNode) => {
+    dom.removeChild(childNode);
+  });
+};
+
 export default {
   name: "video-communication",
   components: { SecondTimer },
@@ -153,19 +159,21 @@ export default {
         pageNumber: this.current,
         pageSize: this.size,
       }).catch(() => {});
-      this.students = res.data.data.records.map((item) => {
-        item.durationTime = timeNumberToText(item.endTime - item.startTime);
-        item.startTime = formatDate(
-          "YYYY-MM-DD HH:mm:ss",
-          new Date(item.startTime)
-        );
-        item.endTime = formatDate(
-          "YYYY-MM-DD HH:mm:ss",
-          new Date(item.endTime)
-        );
-        return item;
-      });
-      this.total = res.data.data.total;
+      if (res) {
+        this.students = res.data.data.records.map((item) => {
+          item.durationTime = timeNumberToText(item.endTime - item.startTime);
+          item.startTime = formatDate(
+            "YYYY-MM-DD HH:mm:ss",
+            new Date(item.startTime)
+          );
+          item.endTime = formatDate(
+            "YYYY-MM-DD HH:mm:ss",
+            new Date(item.endTime)
+          );
+          return item;
+        });
+        this.total = res.data.data.total;
+      }
       // 当前页没有数据，同时当前页不是第一页，则自动跳到前一页。
       if (!this.students.length && this.current > 1) {
         this.current--;
@@ -214,7 +222,7 @@ export default {
       let initLocalStreamResult = true;
       await localStream.initialize().catch((error) => {
         console.log(errorTips[error.name]);
-        this.notifyError(errorTips[error.name]);
+        this.notifyError(errorTips[error.name] || "未知错误");
         initLocalStreamResult = false;
         localStream.close();
       });
@@ -241,23 +249,27 @@ export default {
       // 添加远程用户视频发布监听
       this.client.on("stream-added", (event) => {
         console.log(event);
-        if (event.stream.userId_ !== student.sourceUserId) return;
-
+        console.log(event.stream.getUserId(), student.sourceUserId);
         const remoteStream = event.stream;
+        if (remoteStream.getUserId() !== student.sourceUserId) return;
+        console.log(`有效视频${remoteStream.getUserId()}，准备订阅`);
+
         this.client
           .subscribe(remoteStream, { audio: true, video: true })
-          .then(() => {
-            console.log("开始订阅视频成功！");
-          })
           .catch((error) => {
-            console.log("订阅视频失败！", error);
+            console.log(`${remoteStream.getUserId()}视频订阅失败！`, error);
             this.notifyError("学生视频获取失败！");
           });
       });
       this.client.on("stream-subscribed", (event) => {
-        console.log("视频已订阅！");
         const remoteStream = event.stream;
+        console.log(remoteStream.hasAudio(), remoteStream.hasVideo());
+        if (!remoteStream.hasAudio() || !remoteStream.hasVideo()) return;
+
+        console.log(event);
+        console.log(`${remoteStream.getUserId()}视频已订阅！`);
         if (!this.$refs.SecondTimer.recoding) this.$refs.SecondTimer.start();
+        domEmpty(document.getElementById("communication-host"));
         remoteStream.play("communication-host", { objectFit: "contain" });
       });
 
@@ -275,12 +287,13 @@ export default {
           this.notifyError("接通通信失败！");
         });
       if (!roomJoinResult) return;
+      console.log("加入房间成功！");
 
       // 切换角色，连麦互动
       let switchResult = true;
       await this.client.switchRole("anchor").catch((error) => {
         console.log("切换角色失败！", error);
-        this.notifyError("接通通信失败！");
+        this.notifyError("角色错误！");
         switchResult = false;
       });
       if (!switchResult) return;
@@ -293,6 +306,7 @@ export default {
         publishStreamResult = false;
       });
       if (!publishStreamResult) return;
+      console.log("发布本地音视频成功！");
 
       // 播放本地视频
       this.localStream.play("communication-guest", { muted: true });

src/features/invigilation/RealtimeMonitoring/WarningDetail.vue

@@ -310,6 +310,12 @@ import SecondTimer from "../common/SecondTimer";
 import { formatDate, timeNumberToText, objTypeOf } from "@/utils/utils";
 import { mapState } from "vuex";
 
+const domEmpty = (dom) => {
+  dom.childNodes.forEach((childNode) => {
+    dom.removeChild(childNode);
+  });
+};
+
 export default {
   name: "warning-detail",
   components: {
@@ -629,7 +635,7 @@ export default {
       let initLocalStreamResult = true;
       await localStream.initialize().catch((error) => {
         console.log(errorTips[error.name]);
-        this.notifyError(errorTips[error.name]);
+        this.notifyError(errorTips[error.name] || "未知错误");
         initLocalStreamResult = false;
         localStream.close();
       });
@@ -656,31 +662,40 @@ export default {
       this.holding = false;
       // 添加远程用户视频发布监听
       this.client.on("stream-added", (event) => {
+        // 同一个userId这里会有两次流新增事件：
+        // 事件1：有音频，无视频
+        // 事件2：无音频，有视频
         console.log(event);
-        console.log(event.stream.userId_, this.userMonitor.sourceUserId);
-        if (event.stream.userId_ !== this.userMonitor.sourceUserId) return;
+        console.log(event.stream.getUserId(), this.userMonitor.sourceUserId);
         const remoteStream = event.stream;
+        if (remoteStream.getUserId() !== this.userMonitor.sourceUserId) return;
+        // console.log(remoteStream.hasAudio(), remoteStream.hasVideo());
+        console.log(`有效视频${remoteStream.getUserId()}，准备订阅`);
 
         // 延迟订阅视频
         this.subscribeSetT = setTimeout(() => {
           this.client
             .subscribe(remoteStream, { audio: true, video: true })
-            .then(() => {
-              console.log("开始订阅视频成功！");
-            })
             .catch((error) => {
-              console.log("订阅视频失败！", error);
+              console.log(`${remoteStream.getUserId()}视频订阅失败！`, error);
               this.notifyError("学生视频获取失败！");
             });
         }, 5000);
       });
       this.client.on("stream-subscribed", (event) => {
-        console.log("视频已订阅！");
-        console.log(event);
+        // 同一个userId这里会有两次已订阅事件：
+        // 事件1：有音频，有视频
+        // 事件2：无音频，有视频
         const remoteStream = event.stream;
+        console.log(remoteStream.hasAudio(), remoteStream.hasVideo());
+        if (!remoteStream.hasAudio() || !remoteStream.hasVideo()) return;
+
+        console.log(event);
+        console.log(`${remoteStream.getUserId()}视频已订阅！`);
         this.isWaiting = false;
         this.$nextTick(() => {
           if (!this.$refs.SecondTimer.recoding) this.$refs.SecondTimer.start();
+          domEmpty(document.getElementById("communication-host"));
           remoteStream.play("communication-host", { objectFit: "contain" });
         });
       });
@@ -698,12 +713,13 @@ export default {
           this.notifyError("发起通信失败！");
         });
       if (!roomJoinResult) return;
+      console.log("加入房间成功！");
 
       // 切换角色，连麦互动
       let switchResult = true;
       await this.client.switchRole("anchor").catch((error) => {
         console.log("切换角色失败！", error);
-        this.notifyError("发起通信失败！");
+        this.notifyError("角色错误！");
         switchResult = false;
       });
       if (!switchResult) return;
@@ -716,6 +732,7 @@ export default {
         publishStreamResult = false;
       });
       if (!publishStreamResult) return;
+      console.log("发布本地音视频成功！");
 
       // 播放本地视频
       this.localStream.play("communication-guest", { muted: true });