diff --git a/package-lock.json b/package-lock.json index f037c81..834dfb8 100644 --- a/package-lock.json +++ b/package-lock.json @@ -25,7 +25,7 @@ "vue-router": "^4.4.5", "vue3-seamless-scroll": "^2.0.1", "vuedraggable": "^4.1.0", - "whepts": "^1.0.2" + "whepts": "^1.1.11" }, "devDependencies": { "@vitejs/plugin-vue": "^5.2.1", @@ -3335,6 +3335,12 @@ "integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==", "license": "MIT" }, + "node_modules/eventemitter3": { + "version": "5.0.4", + "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-5.0.4.tgz", + "integrity": "sha512-mlsTRyGaPBjPedk6Bvw+aqbsXDtoAyAzm5MO7JgU+yVRyMQ5O8bD4Kcci7BS85f93veegeCPkL8R4GLClnjLFw==", + "license": "MIT" + }, "node_modules/events": { "version": "3.3.0", "resolved": "https://registry.npmjs.org/events/-/events-3.3.0.tgz", @@ -4324,6 +4330,21 @@ "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1" } }, + "node_modules/nanostores": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/nanostores/-/nanostores-1.1.0.tgz", + "integrity": "sha512-yJBmDJr18xy47dbNVlHcgdPrulSn1nhSE6Ns9vTG+Nx9VPT6iV1MD6aQFp/t52zpf82FhLLTXAXr30NuCnxvwA==", + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/ai" + } + ], + "license": "MIT", + "engines": { + "node": "^20.0.0 || >=22.0.0" + } + }, "node_modules/neo-async": { "version": "2.6.2", "resolved": "https://registry.npmjs.org/neo-async/-/neo-async-2.6.2.tgz", @@ -6167,10 +6188,14 @@ "license": "MIT" }, "node_modules/whepts": { - "version": "1.0.2", - "resolved": "https://registry.npmjs.org/whepts/-/whepts-1.0.2.tgz", - "integrity": "sha512-9P0OP514Z2ZR2ev7qMOApplw6ERMChqgPi6eWWn6HTlTpDV0gW7Zqs4kLAKIV7xqxXCDNDCorxNz8ekOYAEp5g==", - "license": "MIT" + "version": "1.1.11", + "resolved": "https://registry.npmjs.org/whepts/-/whepts-1.1.11.tgz", + "integrity": "sha512-NJ37rUXS4aeO36sxmSTxMZTGXdScedxdhAt7oKhFhzAeV/IjNCWdyu8d+fSGSEAPjJS4FnBzwSFLrENZjAqcRA==", + "license": "MIT", + "dependencies": { + "eventemitter3": "^5.0.4", + "nanostores": "^1.1.0" + } }, "node_modules/which": { "version": "2.0.2", diff --git a/package.json b/package.json index 888e449..83ac73f 100644 --- a/package.json +++ b/package.json @@ -26,7 +26,7 @@ "vue-router": "^4.4.5", "vue3-seamless-scroll": "^2.0.1", "vuedraggable": "^4.1.0", - "whepts": "^1.0.2" + "whepts": "^1.1.11" }, "devDependencies": { "@vitejs/plugin-vue": "^5.2.1", diff --git a/src/components/HlsPlayer/index.vue b/src/components/HlsPlayer/index.vue index 35400a8..6229011 100644 --- a/src/components/HlsPlayer/index.vue +++ b/src/components/HlsPlayer/index.vue @@ -168,8 +168,12 @@ export default { this.hls = new WebRTCWhep({ url: this.url, // WHEP 服务器地址 container: this.video, // 视频播放容器 - onError: (error) => { - console.error('播放错误:', error) + iceServers: [{ urls: 'turn:192.168.77.200:3478',username: 'ZLMediaKit',credential: 'ZLMediaKit'}] + }) + this.hls.on('error', (error) => { + console.error('错误:', error.message, error.type) + if(error.type ==='REQUEST_ERROR' || error.type ==='NOT_FOUND_ERROR'){ + this.initializePlayer(); } }) }else{ diff --git a/src/layout/components/CoreVideo/allList.vue b/src/layout/components/CoreVideo/allList.vue index 008f4f5..8e6ba82 100644 --- a/src/layout/components/CoreVideo/allList.vue +++ b/src/layout/components/CoreVideo/allList.vue @@ -129,8 +129,12 @@ const player = new WebRTCWhep({ url: url, // WHEP 服务器地址 container: videoElement, // 视频播放容器 - onError: (error) => { - console.error('播放错误:', error) + iceServers: [{ urls: 'turn:192.168.77.200:3478',username: 'ZLMediaKit',credential: 'ZLMediaKit'}] + }) + player.on('error', (error) => { + console.error('错误:', error.message, error.type) + if(error.type ==='REQUEST_ERROR' || error.type ==='NOT_FOUND_ERROR'){ + createPlayer(cameraIndexCode,videoElement); } }) webrtcRefs.push(player) diff --git a/src/views/collect/components/video-box.vue b/src/views/collect/components/video-box.vue index ecb083f..e184fb9 100644 --- a/src/views/collect/components/video-box.vue +++ b/src/views/collect/components/video-box.vue @@ -304,8 +304,12 @@ const createPlayer = (cameraIndexCode,videoElement) => { const player = new WebRTCWhep({ url: url, // WHEP 服务器地址 container: videoElement, // 视频播放容器 - onError: (error) => { - console.error('播放错误:', error) + iceServers: [{ urls: 'turn:192.168.77.200:3478',username: 'ZLMediaKit',credential: 'ZLMediaKit'}] + }) + player.on('error', (error) => { + console.error('错误:', error.message, error.type) + if(error.type ==='REQUEST_ERROR' || error.type ==='NOT_FOUND_ERROR'){ + createPlayer(cameraIndexCode,videoElement); } }) webrtcRefs.push(player) diff --git a/src/views/hotel/components/video-box.vue b/src/views/hotel/components/video-box.vue index 20ab004..106e9b3 100644 --- a/src/views/hotel/components/video-box.vue +++ b/src/views/hotel/components/video-box.vue @@ -346,10 +346,15 @@ const createPlayer = (cameraIndexCode,videoElement) => { const player = new WebRTCWhep({ url:url, // WHEP 服务器地址 container: videoElement, // 视频播放容器 - onError: (error) => { - console.error('播放错误:', error) + iceServers: [{ urls: 'turn:192.168.77.200:3478',username: 'ZLMediaKit',credential: 'ZLMediaKit'}] + }) + player.on('error', (error) => { + console.error('错误:', error.message, error.type) + if(error.type ==='REQUEST_ERROR' || error.type ==='NOT_FOUND_ERROR'){ + createPlayer(cameraIndexCode,videoElement); } }) + webrtcRefs.push(player) } else{ @@ -427,11 +432,19 @@ const handleItemVideo = async (url, type, code, item) => { cameraIndexCode.value = code setTimeout(() => { if (url.startsWith('http://192.168.77.200:8050/')) { - hlsRef = new WebRTCWhep({ - url: url, // WHEP 服务器地址 - container: videoRef.value, // 视频播放容器 - onError: (error) => { - console.error('播放错误:', error) + if(hlsRef) { + hlsRef.updateUrl(url); + }else{ + hlsRef = new WebRTCWhep({ + url: url, // WHEP 服务器地址 + container: videoRef.value, // 视频播放容器 + iceServers: [{ urls: 'turn:192.168.77.200:3478',username: 'ZLMediaKit',credential: 'ZLMediaKit'}] + }) + } + hlsRef.on('error', (error) => { + console.error('错误:', error.message, error.type) + if(error.type ==='REQUEST_ERROR' || error.type ==='NOT_FOUND_ERROR'){ + handleItemVideo(url, type, code, item); } }) } else { diff --git a/src/views/monitor/components/box-2.vue b/src/views/monitor/components/box-2.vue index a7f352c..971d0e7 100644 --- a/src/views/monitor/components/box-2.vue +++ b/src/views/monitor/components/box-2.vue @@ -265,8 +265,12 @@ const player = new WebRTCWhep({ url: url, // WHEP 服务器地址 container: videoElement, // 视频播放容器 - onError: (error) => { - console.error('播放错误:', error) + iceServers: [{ urls: 'turn:192.168.77.200:3478',username: 'ZLMediaKit',credential: 'ZLMediaKit'}] + }) + player.on('error', (error) => { + console.error('错误:', error.message, error.type) + if(error.type ==='REQUEST_ERROR' || error.type ==='NOT_FOUND_ERROR'){ + createPlayer(cameraIndexCode,videoElement); } }) webrtcRefs.push(player) @@ -397,11 +401,19 @@ cameraIndexCode.value = code setTimeout(() => { if (url.startsWith('http://192.168.77.200:8050/')) { - hlsRef = new WebRTCWhep({ - url: url, // WHEP 服务器地址 - container: videoRef.value, // 视频播放容器 - onError: (error) => { - console.error('播放错误:', error) + if(hlsRef){ + hlsRef.updateUrl(url); + }else{ + hlsRef = new WebRTCWhep({ + url: url, // WHEP 服务器地址 + container: videoRef.value, // 视频播放容器 + iceServers: [{ urls: 'turn:192.168.77.200:3478',username: 'ZLMediaKit',credential: 'ZLMediaKit'}] + }) + } + hlsRef.on('error', (error) => { + console.error('错误:', error.message, error.type) + if(error.type ==='REQUEST_ERROR' || error.type ==='NOT_FOUND_ERROR'){ + handleItemVideo(url, type, code, item); } }) } else {