Replace eventSource reconnect interval with timeout

This commit is contained in:
Rune Harlyk
2024-04-03 22:45:05 +02:00
committed by Rune Harlyk
parent b8c28fc545
commit 0724705939
+47 -109
View File
@@ -24,7 +24,7 @@
onMount(async () => { onMount(async () => {
if ($user.bearer_token !== '') { if ($user.bearer_token !== '') {
validateUser($user); await validateUser($user);
} }
connectToEventSource(); connectToEventSource();
connectToSocket() connectToSocket()
@@ -68,7 +68,7 @@
} }
onDestroy(() => { onDestroy(() => {
NotificationSource?.close(); disconnectEventSource();
socket?.close(); socket?.close();
}); });
@@ -87,137 +87,75 @@
} catch (error) { } catch (error) {
console.error('Error:', error); console.error('Error:', error);
} }
return;
} }
let menuOpen = false; let menuOpen = false;
let throttle = new throttler(); let throttle = new throttler();
let NotificationSource: EventSource;
let socket: WebSocket let socket: WebSocket
let reconnectIntervalId: number = 0; let eventSourceUrl = '/events';
let connectionLost = false; let eventSource: EventSource;
let unresponsiveTimeout: number; let unresponsiveTimeoutId: number;
function connectToEventSource() { function connectToEventSource() {
NotificationSource = new EventSource('/events'); eventSource = new EventSource(eventSourceUrl);
console.log('Attempting SSE connection.');
NotificationSource.addEventListener('open', () => { eventSource.addEventListener('open', () => {
clearInterval(reconnectIntervalId);
reconnectIntervalId = 0;
connectionLost = false;
console.log('SSE connection established');
notifications.success('Connection to device established', 5000); notifications.success('Connection to device established', 5000);
telemetry.setRSSI('found'); // Update store and flag as server being available again telemetry.setRSSI('found'); // Update store and flag as server being available again
}); });
NotificationSource.addEventListener( eventSource.addEventListener('rssi', (event) => {
'rssi', telemetry.setRSSI(event.data);
(event) => { resetUnresponsiveCheck();
telemetry.setRSSI(event.data); });
// Reset a timer to detect unresponsiveness
clearTimeout(unresponsiveTimeout);
unresponsiveTimeout = setTimeout(() => { eventSource.addEventListener('error', (event) => {
console.log('Server is unresponsive'); reconnectEventSource();
reconnectEventSource(); });
}, 2000) as unknown as number; // Detect unresponsiveness after 2 seconds
},
false
);
NotificationSource.addEventListener( eventSource.addEventListener('infoToast', (event) => {
'motion', notifications.info(event.data, 5000);
(event) => { });
const data = JSON.parse(event.data);
servoAngles.set(data.angles);
},
false
);
NotificationSource.addEventListener( eventSource.addEventListener('successToast', (event) => {
'error', notifications.success(event.data, 5000);
(event) => { });
reconnectEventSource();
},
false
);
NotificationSource.addEventListener( eventSource.addEventListener('warningToast', (event) => {
'close', notifications.warning(event.data, 5000);
(event) => { });
reconnectEventSource();
},
false
);
NotificationSource.addEventListener( eventSource.addEventListener('errorToast', (event) => {
'infoToast', notifications.error(event.data, 5000);
(event) => { });
notifications.info(event.data, 5000);
},
false
);
NotificationSource.addEventListener( eventSource.addEventListener('battery', (event) => {
'successToast', telemetry.setBattery(event.data);
(event) => { });
notifications.success(event.data, 5000);
},
false
);
NotificationSource.addEventListener( eventSource.addEventListener('download_ota', (event) => {
'warningToast', telemetry.setDownloadOTA(event.data);
(event) => { });
notifications.warning(event.data, 5000); eventSource.addEventListener('analytics', (event) => {
}, analytics.addData(event.data);
false });
); }
NotificationSource.addEventListener( function disconnectEventSource() {
'errorToast', clearTimeout(unresponsiveTimeoutId);
(event) => { eventSource?.close();
notifications.error(event.data, 5000);
},
false
);
NotificationSource.addEventListener(
'battery',
(event) => {
telemetry.setBattery(event.data);
},
false
);
NotificationSource.addEventListener(
'download_ota',
(event) => {
telemetry.setDownloadOTA(event.data);
},
false
);
NotificationSource.addEventListener(
'analytics',
(event) => {
analytics.addData(event.data);
},
false
);
} }
function reconnectEventSource() { function reconnectEventSource() {
if (connectionLost === false) { notifications.error('Connection to device lost', 5000);
NotificationSource.close(); disconnectEventSource();
notifications.error('Connection to device lost', 5000); connectToEventSource();
if (reconnectIntervalId === 0) { }
reconnectIntervalId = setInterval(connectToEventSource, 2000) as unknown as number;
console.log('SSE reconnect Timer ID: ' + reconnectIntervalId); function resetUnresponsiveCheck() {
} clearTimeout(unresponsiveTimeoutId);
} unresponsiveTimeoutId = setTimeout(() => reconnectEventSource(), 2000);
connectionLost = true;
} }
</script> </script>