类型：开发

描述：

src/views/collect/components/video-box.vue

@@ -71,7 +71,7 @@
 	import Hls from 'hls.js'
 	import emptyIco from '@/assets/images/n-icon.png'
 	import { debounce } from 'lodash'
-  import mpegtsjs from "mpegts.js";
+  import WebRTCWhep from 'whepts'
 	// const Z00M_IN = 'ZOOM_IN' // 焦距变大
 	// const Z00M_OUT = 'ZOOM_OUT' // 焦距变小
 	// const UP = 'UP' // 上转
@@ -89,6 +89,7 @@
 	let cond = ref(false)
 	let ACTION = '0'
 	let hlsRefs = []
+	let webrtcRefs = []
 	let hlsRef = null
 	let timer = null
 	let videoLog = ref(1)
@@ -232,12 +233,26 @@
 	}
 	//清除 hls
 	const clearHlsRefs = () => {
-	  if (hlsRefs.length > 0) {
-	    hlsRefs.map((item) => {
-	      item.destroy()
-	    })
-	    hlsRefs = []
-	  }
+    if (hlsRefs.length > 0) {
+      hlsRefs.map((item) => {
+        try{
+          item.destroy()
+        }catch (e) {
+
+        }
+      })
+      hlsRefs = []
+    }
+    if(webrtcRefs.length>0){
+      webrtcRefs.map((item) => {
+        try{
+          item.close()
+        }catch (e) {
+
+        }
+      })
+      webrtcRefs = [];
+    }
 	}
 	// 分页
 	const currentChange = (e) => {
@@ -271,31 +286,16 @@
       cameraIndexCode: cameraIndexCode
     }).then(res=>{
       const url = res.data.url;
-      if(url.startsWith('ws')){
-        const player = mpegtsjs.createPlayer({
-          url: url,
-          type: 'flv',
-          isLive: true,
-          hasAudio: false
+      if(url.startsWith('http://192.168.77.200:8050/')){
+        const player = new WebRTCWhep({
+          url: url, // WHEP 服务器地址
+          container: videoElement, // 视频播放容器
+          onError: (error) => {
+            console.error('播放错误:', error)
+          }
         })
-        player.attachMediaElement(videoElement)
-        player.load()
-        player.play()
-        // 错误处理和重连机制
-        player.on(mpegtsjs.Events.ERROR, (err) => {
-          player.unload();
-          player.destroy();
-          console.error('播放器错误:', err)
-          // 3 秒后尝试重新加载
-          setTimeout(() => {
-            console.error('重新加载【'+cameraIndexCode+'】' )
-            createPlayer(cameraIndexCode,videoElement);
-          }, 3000)
-        })
-
-        hlsRefs.push(player)
-      }
-      else{
+        webrtcRefs.push(player)
+      }else{
         const player = new Hls({
           maxBufferLength: 10, // 最大缓冲长度（秒）
           maxMaxBufferLength: 15, // 缓冲区长度的上限