astra
/
ntfy
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Reconnect on failure, with backoff; Deduping notifications

pull/149/head
Philipp Heckel 2022-02-24 09:52:49 -05:00
parent 3fac1c3432
commit 1536201e9a
6 changed files with 62 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

61
web/src/app/Connection.js
View File

@ -1,18 +1,31 @@
import {shortTopicUrl, topicUrlWs} from "./utils";
const retryBackoffSeconds = [5, 10, 15, 20, 30, 45, 60, 120];
class Connection {
constructor(wsUrl, subscriptionId, onNotification) {
this.wsUrl = wsUrl;
constructor(subscriptionId, baseUrl, topic, since, onNotification) {
this.subscriptionId = subscriptionId;
this.baseUrl = baseUrl;
this.topic = topic;
this.since = since;
this.shortUrl = shortTopicUrl(baseUrl, topic);
this.onNotification = onNotification;
this.ws = null;
this.retryCount = 0;
this.retryTimeout = null;
}
start() {
const socket = new WebSocket(this.wsUrl);
socket.onopen = (event) => {
console.log(`[Connection] [${this.subscriptionId}] Connection established`);
const since = (this.since === 0) ? "all" : this.since.toString();
const wsUrl = topicUrlWs(this.baseUrl, this.topic, since);
console.log(`[Connection, ${this.shortUrl}] Opening connection to ${wsUrl}`);
this.ws = new WebSocket(wsUrl);
this.ws.onopen = (event) => {
console.log(`[Connection, ${this.shortUrl}] Connection established`, event);
this.retryCount = 0;
}
socket.onmessage = (event) => {
console.log(`[Connection] [${this.subscriptionId}] Message received from server: ${event.data}`);
this.ws.onmessage = (event) => {
console.log(`[Connection, ${this.shortUrl}] Message received from server: ${event.data}`);
try {
const data = JSON.parse(event.data);
const relevantAndValid =
@ -21,31 +34,43 @@ class Connection {
'time' in data &&
'message' in data;
if (!relevantAndValid) {
console.log(`[Connection, ${this.shortUrl}] Message irrelevant or invalid. Ignoring.`);
return;
}
this.since = data.time;
this.onNotification(this.subscriptionId, data);
} catch (e) {
console.log(`[Connection] [${this.subscriptionId}] Error handling message: ${e}`);
console.log(`[Connection, ${this.shortUrl}] Error handling message: ${e}`);
}
};
socket.onclose = (event) => {
this.ws.onclose = (event) => {
if (event.wasClean) {
console.log(`[Connection] [${this.subscriptionId}] Connection closed cleanly, code=${event.code} reason=${event.reason}`);
console.log(`[Connection, ${this.shortUrl}] Connection closed cleanly, code=${event.code} reason=${event.reason}`);
this.ws = null;
} else {
console.log(`[Connection] [${this.subscriptionId}] Connection died`);
const retrySeconds = retryBackoffSeconds[Math.min(this.retryCount, retryBackoffSeconds.length-1)];
this.retryCount++;
console.log(`[Connection, ${this.shortUrl}] Connection died, retrying in ${retrySeconds} seconds`);
this.retryTimeout = setTimeout(() => this.start(), retrySeconds * 1000);
}
};
socket.onerror = (event) => {
console.log(this.subscriptionId, `[Connection] [${this.subscriptionId}] ${event.message}`);
this.ws.onerror = (event) => {
console.log(`[Connection, ${this.shortUrl}] Error occurred: ${event}`, event);
};
this.ws = socket;
}
cancel() {
if (this.ws !== null) {
this.ws.close();
this.ws = null;
close() {
console.log(`[Connection, ${this.shortUrl}] Closing connection`);
const socket = this.ws;
const retryTimeout = this.retryTimeout;
if (socket !== null) {
socket.close();
}
if (retryTimeout !== null) {
clearTimeout(retryTimeout);
}
this.retryTimeout = null;
this.ws = null;
}
}

10
web/src/app/ConnectionManager.js
View File

@ -14,10 +14,12 @@ export class ConnectionManager {
subscriptions.forEach((id, subscription) => {
const added = !this.connections.get(id)
if (added) {
const wsUrl = subscription.wsUrl();
const connection = new Connection(wsUrl, id, onNotification);
const baseUrl = subscription.baseUrl;
const topic = subscription.topic;
const since = 0;
const connection = new Connection(id, baseUrl, topic, since, onNotification);
this.connections.set(id, connection);
console.log(`[ConnectionManager] Starting new connection ${id} using URL ${wsUrl}`);
console.log(`[ConnectionManager] Starting new connection ${id}`);
connection.start();
}
});
@ -27,7 +29,7 @@ export class ConnectionManager {
console.log(`[ConnectionManager] Closing connection ${id}`);
const connection = this.connections.get(id);
this.connections.delete(id);
connection.cancel();
connection.close();
});
}
}

21
web/src/app/Subscription.js
View File

@ -1,24 +1,15 @@
import {topicUrl, shortTopicUrl, topicUrlWs} from './utils';
export default class Subscription {
id = '';
baseUrl = '';
topic = '';
notifications = [];
lastActive = null;
constructor(baseUrl, topic) {
this.id = topicUrl(baseUrl, topic);
this.baseUrl = baseUrl;
this.topic = topic;
this.notifications = new Map();
}
addNotification(notification) {
if (notification.time === null) {
return this;
}
this.notifications.push(notification);
this.lastActive = notification.time;
this.notifications.set(notification.id, notification);
return this;
}
@ -27,12 +18,8 @@ export default class Subscription {
return this;
}
url() {
return this.id;
}
wsUrl() {
return topicUrlWs(this.baseUrl, this.topic);
getNotifications() {
return Array.from(this.notifications.values());
}
shortUrl() {

2
web/src/app/utils.js
View File

@ -1,5 +1,5 @@
export const topicUrl = (baseUrl, topic) => `${baseUrl}/${topic}`;
export const topicUrlWs = (baseUrl, topic) => `${topicUrl(baseUrl, topic)}/ws`
export const topicUrlWs = (baseUrl, topic, since) => `${topicUrl(baseUrl, topic)}/ws?since=${since}`
.replaceAll("https://", "wss://")
.replaceAll("http://", "ws://");
export const topicUrlJson = (baseUrl, topic) => `${topicUrl(baseUrl, topic)}/json`;

3
web/src/components/AddDialog.js
View File

@ -9,7 +9,8 @@ import DialogTitle from '@mui/material/DialogTitle';
import {useState} from "react";
import Subscription from "../app/Subscription";
const defaultBaseUrl = "https://ntfy.sh"
const defaultBaseUrl = "http://127.0.0.1"
//const defaultBaseUrl = "https://ntfy.sh"
const AddDialog = (props) => {
const [topic, setTopic] = useState("");

10
web/src/components/App.js
View File

@ -101,7 +101,7 @@ const SubscriptionNavItem = (props) => {
}
const App = () => {
console.log("Launching App component");
console.log(`[App] Rendering main view`);
const [drawerOpen, setDrawerOpen] = useState(true);
const [subscriptions, setSubscriptions] = useState(new Subscriptions());
@ -114,6 +114,7 @@ const App = () => {
});
};
const handleSubscribeSubmit = (subscription) => {
console.log(`[App] New subscription: ${subscription.id}`);
setSubscribeDialogOpen(false);
setSubscriptions(prev => prev.add(subscription).clone());
setSelectedSubscription(subscription);
@ -126,10 +127,11 @@ const App = () => {
});
};
const handleSubscribeCancel = () => {
console.log(`Cancel clicked`);
console.log(`[App] Cancel clicked`);
setSubscribeDialogOpen(false);
};
const handleUnsubscribe = (subscriptionId) => {
console.log(`[App] Unsubscribing from ${subscriptionId}`);
setSubscriptions(prev => {
const newSubscriptions = prev.remove(subscriptionId).clone();
setSelectedSubscription(newSubscriptions.firstOrNull());
@ -137,10 +139,10 @@ const App = () => {
});
};
const handleSubscriptionClick = (subscriptionId) => {
console.log(`Selected subscription ${subscriptionId}`);
console.log(`[App] Selected ${subscriptionId}`);
setSelectedSubscription(subscriptions.get(subscriptionId));
};
const notifications = (selectedSubscription !== null) ? selectedSubscription.notifications : [];
const notifications = (selectedSubscription !== null) ? selectedSubscription.getNotifications() : [];
const toggleDrawer = () => {
setDrawerOpen(!drawerOpen);
};