reload webrtc if times out

mrlt8 · Jun 24, 2024 · 357857c · 357857c
1 parent ded793f
commit 357857c
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 6 deletions.
diff --git a/app/static/site.js b/app/static/site.js
@@ -682,8 +682,8 @@ document.addEventListener("DOMContentLoaded", () => {
     });
   });
   // Load WS for WebRTC on demand
-  function loadWebRTC(video, force = false) {
-    if (!force && (!video.classList.contains("placeholder") || !video.classList.contains("connected"))) { return }
+  function loadWebRTC(video) {
+    if (!video.classList.contains("placeholder")) { return }
     let videoFormat = getCookie("video");
     video.classList.remove("placeholder");
     video.controls = true;

diff --git a/app/static/webrtc.js b/app/static/webrtc.js
@@ -56,6 +56,7 @@ class Receiver {
         this.ws = null;
         this.pc = null;
         this.sessionUrl = '';
+        this.iceConnectionTimer;
         this.start();
     }
     start() {
@@ -69,15 +70,13 @@ class Receiver {
 
     onOpen() {
         const direction = this.whep ? "sendrecv" : "recvonly";
-
         this.pc = new RTCPeerConnection({ iceServers: this.signalJson.servers, sdpSemantics: 'unified-plan' });
         this.pc.addTransceiver("video", { direction });
         this.pc.addTransceiver("audio", { direction });
         this.pc.ontrack = (evt) => this.onTrack(evt);
         this.pc.onicecandidate = (evt) => this.onIceCandidate(evt);
         this.pc.oniceconnectionstatechange = () => this.onConnectionStateChange();
         this.pc.createOffer().then((desc) => this.createOffer(desc));
-
     }
     createOffer(desc) {
         this.pc.setLocalDescription(desc);
@@ -144,6 +143,7 @@ class Receiver {
     }
 
     onConnectionStateChange() {
+        clearTimeout(this.iceConnectionTimer);
         if (this.restartTimeout !== null) { return; }
         switch (this.pc.iceConnectionState) {
             case 'disconnected':
@@ -194,14 +194,32 @@ class Receiver {
             }
         } else {
             this.sendToServer('ICE_CANDIDATE', evt.candidate);
+            if (!this.iceConnectionTimer) {
+                this.iceConnectionTimer = setTimeout(() => {
+                    if (this.pc.iceConnectionState !== 'start') {
+                        this.pc.close();
+                        this.onError("ICE connection timeout")
+                    }
+                }, 30000);
+            }
         }
     }
+    refreshSignal() {
+        fetch(new URL(`signaling/${this.signalJson.cam}?${this.whep ? 'webrtc' : 'kvs'}`, window.location.href))
+            .then((resp) => resp.json())
+            .then((signalJson) => {
+                if (signalJson.result !== "ok") { return console.error("signaling json not ok"); }
+                this.signalJson = signalJson;
+            });
+    }
 
     onError(err = undefined) {
         if (this.restartTimeout !== null) {
             return;
         }
         if (err !== undefined) { console.error('Error:', err.toString()); }
+        clearTimeout(this.iceConnectionTimer);
+        this.iceConnectionTimer = null;
 
         if (this.ws !== null) {
             this.ws.close();
@@ -213,7 +231,13 @@ class Receiver {
         }
         this.restartTimeout = window.setTimeout(() => {
             this.restartTimeout = null;
-            this.start();
+            const connection = document.getElementById("connection-lost");
+            if (connection && connection.style.display === "block") {
+                this.onError()
+            } else {
+                this.refreshSignal();
+                this.start();
+            }
         }, restartPause);
 
         if (this.sessionUrl !== '' && this.signalJson.whep) {
@@ -223,7 +247,6 @@ class Receiver {
             });
         }
         this.sessionUrl = '';
-
         this.queuedCandidates = [];
     }
 };