ton1c/Keyborg
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

workind on websocket

Browse Source
This commit is contained in:
ton1c
2025-02-28 19:39:03 +03:00
parent 44649ef89a
commit b8d705a805
19 changed files with 531 additions and 243 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
deno.lock generated
View File

@ -41,6 +41,7 @@
"npm:@minify-html/wasm@*": "0.15.0",
"npm:@tauri-apps/api@2": "2.2.0",
"npm:@tauri-apps/cli@2": "2.2.5",
"npm:@tauri-apps/cli@2.2.5": "2.2.5",
"npm:@tauri-apps/plugin-shell@2": "2.2.0",
"npm:esbuild-plugin-tsc@*": "0.4.0_typescript@5.7.3",
"npm:esbuild-plugin-tsc@0.4": "0.4.0_typescript@5.7.3",

9
server/api.ts
View File

@ -85,8 +85,8 @@ const updateDevicesApiSchema = {
};
export const updateDevicesApi = new Api(
"/api/updateDevices",
"POST",
"/api/devices/detect",
"GET",
updateDevicesApiSchema,
);
@ -102,9 +102,8 @@ const versionApiSchema = {
]),
),
};
export const versionApi = new Api(
"/version",
"POST",
"/api/version",
"GET",
versionApiSchema,
);

10
server/main.ts
View File

@ -1,4 +1,4 @@
import HttpRouter from "@lib/router.ts";
import HttpRouter from "@src/lib/router.ts";
import { Eta } from "@eta-dev/eta";
import { serveFile } from "jsr:@std/http/file-server";
import rateLimitMiddleware from "@src/middleware/rateLimiter.ts";
@ -24,7 +24,7 @@ import {
import devices from "@src/lib/devices.ts";
const AUTH_COOKIE_NAME = "token";
const VERSION = "0.1.0";
const VERSION = "0.1.0-a.1";
const router = new HttpRouter();
@ -93,7 +93,7 @@ router
);
});
router.get("ws", (c) => {
router.get("/api/admin/ws", (c) => {
if (c.req.headers.get("upgrade") != "websocket") {
return new Response(null, { status: 501 });
}
@ -110,7 +110,7 @@ router.get("ws", (c) => {
socket.addEventListener("message", (event) => {
if (event.data === "ping") {
console.log("pinged!");
console.log("ping");
socket.send("pong");
}
});
@ -193,7 +193,7 @@ router
});
function handleCommonErrors(
c: Context<any, any, any>,
c: Context,
error:
| QueryExecutionError
| FailedToParseRequestAsJSONError

2
server/public/js/index.js
View File

@ -1 +1 @@
class c{ws=null;url;reconnectInterval;maxReconnectInterval;reconnectDecay;timeout;forcedClose=!1;onmessage;constructor(e,t={}){this.url=e,this.reconnectInterval=t.reconnectInterval??1e3,this.maxReconnectInterval=t.maxReconnectInterval??3e4,this.reconnectDecay=t.reconnectDecay??1.5,this.timeout=t.timeout??2e3,this.connect()}connect(e=!1){console.log(`Connecting to ${this.url}...`),this.ws=new WebSocket(this.url);let t=setTimeout(()=>{console.warn("Connection timeout, closing socket."),this.ws?.close()},this.timeout);this.ws.onopen=n=>{clearTimeout(t),console.log("WebSocket connected."),this.onmessage&&this.ws?.addEventListener("message",this.onmessage)},this.ws.onerror=n=>{console.error("WebSocket error:",n)},this.ws.onclose=n=>{clearTimeout(t),console.log("WebSocket closed:",n.reason),this.forcedClose||setTimeout(()=>{this.reconnectInterval=Math.min(this.reconnectInterval*this.reconnectDecay,this.maxReconnectInterval),this.connect(!0)},this.reconnectInterval)}}onMessage(e){this.ws&&this.ws.addEventListener("message",e),this.onmessage=e}send(e){this.ws&&this.ws.readyState===WebSocket.OPEN?this.ws.send(e):console.error("WebSocket is not open. Message not sent.")}close(){this.forcedClose=!0,this.ws?.close()}}const s=new c("/ws");s.onMessage(o=>{console.log(o.data)});const i=document.getElementById("ping");i.onclick=()=>{s.send("ping")};
import{WebSocketWrapper as o}from"./shared.bundle.js";const c=document.getElementById("ping"),i=document.getElementById("reconnect"),e=document.getElementById("info");c.onclick=async()=>{await n.ping()},i.onclick=async()=>{console.log(await n.connect())};const n=new o("api/admin/ws");n.onConnectInit=()=>{e.innerText="Connecting..."},n.onConnectSucc=()=>{e.innerText="Connected!"},n.onConnectFail=()=>{e.innerText="Failed to reconnect"},n.onDisconnect=()=>{e.innerText="Connection lost"},n.onMessage=t=>{console.log(t.data)},await n.connect();

2
server/public/js/login.js
View File

@ -1 +1 @@
import{loginApi as o}from"./shared.bundle.js";const r=document.getElementById("loginForm"),s=document.getElementById("passwordInput"),i=document.getElementById("errDiv");r.addEventListener("submit",async t=>{t.preventDefault();const n=s.value,e=(await o.makeRequest({password:n},{})).flatten();e.isErr()?i.innerText=e.error.info:window.location.href="/"});
import{loginApi as o}from"./shared.bundle.js";const s=document.getElementById("loginForm"),r=document.getElementById("passwordInput"),i=document.getElementById("errDiv");s.addEventListener("submit",async t=>{t.preventDefault();const n=r.value,e=(await o.makeRequest({password:n},{})).flatten();e.isErr()?i.innerText=e.error.info:window.location.href="/"});const m=new WebSocket("api/admin/ws");

2
server/public/js/shared.bundle.js
View File

File diff suppressed because one or more lines are too long

233
server/src/js/index.ts
View File

@ -1,103 +1,138 @@
interface ReconnectOptions {
reconnectInterval?: number; // Initial reconnect delay (ms)
maxReconnectInterval?: number; // Maximum delay (ms)
reconnectDecay?: number; // Exponential backoff multiplier
timeout?: number; // Connection timeout (ms)
}
class ReconnectingWebSocketClient {
private ws: WebSocket | null = null;
private url: string;
private reconnectInterval: number;
private maxReconnectInterval: number;
private reconnectDecay: number;
private timeout: number;
private forcedClose: boolean = false;
private onmessage?: (ev: MessageEvent) => any;
constructor(
url: string,
options: ReconnectOptions = {},
) {
this.url = url;
this.reconnectInterval = options.reconnectInterval ?? 1000; // 1 second
this.maxReconnectInterval = options.maxReconnectInterval ?? 30000; // 30 seconds
this.reconnectDecay = options.reconnectDecay ?? 1.5;
this.timeout = options.timeout ?? 2000; // 2 seconds
this.connect();
}
private connect(isReconnect: boolean = false): void {
console.log(`Connecting to ${this.url}...`);
this.ws = new WebSocket(this.url);
let connectionTimeout = setTimeout(() => {
console.warn("Connection timeout, closing socket.");
this.ws?.close();
}, this.timeout);
this.ws.onopen = (event: Event) => {
clearTimeout(connectionTimeout);
console.log("WebSocket connected.");
if (this.onmessage) {
this.ws?.addEventListener("message", this.onmessage);
}
// On connection, send login credentials
// Optionally, if this is a reconnection, you could dispatch a custom event or handle state changes.
};
this.ws.onerror = (event: Event) => {
console.error("WebSocket error:", event);
};
this.ws.onclose = (event: CloseEvent) => {
clearTimeout(connectionTimeout);
console.log("WebSocket closed:", event.reason);
if (!this.forcedClose) {
// Schedule reconnection with exponential backoff
setTimeout(() => {
this.reconnectInterval = Math.min(
this.reconnectInterval * this.reconnectDecay,
this.maxReconnectInterval,
);
this.connect(true);
}, this.reconnectInterval);
}
};
}
public onMessage(fn: (e: MessageEvent) => void) {
if (this.ws) {
this.ws.addEventListener("message", fn);
}
this.onmessage = fn;
}
public send(data: any): void {
if (this.ws && this.ws.readyState === WebSocket.OPEN) {
this.ws.send(data);
} else {
console.error("WebSocket is not open. Message not sent.");
}
}
public close(): void {
this.forcedClose = true;
this.ws?.close();
}
}
const ws = new ReconnectingWebSocketClient("/ws");
ws.onMessage((e) => {
console.log(e.data);
});
import { WebSocketWrapper } from "./shared.bundle.ts";
//interface ReconnectOptions {
// reconnectInterval?: number; // Initial reconnect delay (ms)
// maxReconnectInterval?: number; // Maximum delay (ms)
// reconnectDecay?: number; // Exponential backoff multiplier
// timeout?: number; // Connection timeout (ms)
//}
//
//class ReconnectingWebSocketClient {
// private ws: WebSocket | null = null;
// private url: string;
// private reconnectInterval: number;
// private maxReconnectInterval: number;
// private reconnectDecay: number;
// private timeout: number;
// private forcedClose: boolean = false;
// private onmessage?: (ev: MessageEvent) => any;
//
// constructor(
// url: string,
// options: ReconnectOptions = {},
// ) {
// this.url = url;
// this.reconnectInterval = options.reconnectInterval ?? 1000; // 1 second
// this.maxReconnectInterval = options.maxReconnectInterval ?? 30000; // 30 seconds
// this.reconnectDecay = options.reconnectDecay ?? 1.5;
// this.timeout = options.timeout ?? 2000; // 2 seconds
// this.connect();
// }
//
// private connect(isReconnect: boolean = false): void {
// console.log(`Connecting to ${this.url}...`);
//
// this.ws = new WebSocket(this.url);
// let connectionTimeout = setTimeout(() => {
// console.warn("Connection timeout, closing socket.");
// this.ws?.close();
// }, this.timeout);
//
// this.ws.onopen = (event: Event) => {
// clearTimeout(connectionTimeout);
// console.log("WebSocket connected.");
//
// if (this.onmessage) {
// this.ws?.addEventListener("message", this.onmessage);
// }
//
// // On connection, send login credentials
// // Optionally, if this is a reconnection, you could dispatch a custom event or handle state changes.
// };
//
// this.ws.onerror = (event: Event) => {
// console.error("WebSocket error:", event);
// };
//
// this.ws.onclose = (event: CloseEvent) => {
// clearTimeout(connectionTimeout);
// console.log("WebSocket closed:", event.reason);
// if (!this.forcedClose) {
// // Schedule reconnection with exponential backoff
// setTimeout(() => {
// this.reconnectInterval = Math.min(
// this.reconnectInterval * this.reconnectDecay,
// this.maxReconnectInterval,
// );
// this.connect(true);
// }, this.reconnectInterval);
// }
// };
// }
//
// public onMessage(fn: (e: MessageEvent) => void) {
// if (this.ws) {
// this.ws.dispatchEvent;
// this.ws.addEventListener("message", fn);
// }
//
// this.onmessage = fn;
// }
//
// public send(data: any): void {
// if (this.ws && this.ws.readyState === WebSocket.OPEN) {
// this.ws.send(data);
// } else {
// console.error("WebSocket is not open. Message not sent.");
// }
// }
//
// public close(): void {
// this.forcedClose = true;
// this.ws?.close();
// }
//}
//
//const ws = new ReconnectingWebSocketClient("/ws");
//
//ws.onMessage((e) => {
// console.log(e.data);
//});
//
const pingBtn = document.getElementById("ping") as HTMLButtonElement;
const reconBtn = document.getElementById("reconnect") as HTMLButtonElement;
const infoDiv = document.getElementById("info") as HTMLDivElement;
pingBtn.onclick = () => {
ws.send("ping");
pingBtn.onclick = async () => {
await wrapper.ping();
};
reconBtn.onclick = async () => {
console.log(await wrapper.connect());
};
const wrapper = new WebSocketWrapper(
"api/admin/ws",
);
wrapper.onConnectInit = () => {
infoDiv.innerText = "Connecting...";
};
wrapper.onConnectSucc = () => {
infoDiv.innerText = "Connected!";
};
wrapper.onConnectFail = () => {
infoDiv.innerText = "Failed to reconnect";
};
wrapper.onDisconnect = () => {
infoDiv.innerText = "Connection lost";
};
wrapper.onMessage = (ev) => {
console.log(ev.data);
};
await wrapper.connect();

2
server/src/js/login.ts
View File

@ -21,3 +21,5 @@ form.addEventListener("submit", async (e) => {
window.location.href = "/";
}
});
const ws = new WebSocket("api/admin/ws");

1
server/src/js/shared.bundle.ts
View File

@ -3,3 +3,4 @@ export * from "@shared/utils/result.ts";
export * from "@shared/utils/resultasync.ts";
export * from "@shared/utils/validator.ts";
export * from "../../api.ts";
export * from "@src/lib/wsClient.ts";

22
server/src/lib/devices.ts
View File

@ -13,6 +13,8 @@ import {
type FailedToAccessDevices = CommandExecutionError | UsbipUnknownError;
const DEFAULT_STATE = 0;
class Devices {
private devices: Result<
Map<string, Device>,
@ -34,9 +36,20 @@ class Devices {
);
}
for (const key of Object.keys(update)) {
device[key as keyof typeof update] =
update[key as keyof typeof update] || none;
for (const key of Object.keys(update) as (keyof DeviceMutables)[]) {
if (update[key] !== undefined) {
switch (key) {
case "status":
device.status = update.status ?? device.status;
break;
case "displayName":
device.displayName = update.displayName ?? none;
break;
case "description":
device.description = update.description ?? none;
break;
}
}
}
return ok();
@ -89,6 +102,7 @@ class Devices {
usbid: d.usbid,
vendor: d.vendor,
name: d.name,
status: DEFAULT_STATE,
displayName: none,
description: none,
connectedAt: new Date(),
@ -107,12 +121,14 @@ export const deviceSchema = z.obj({
usbid: z.option(z.string()),
vendor: z.option(z.string()),
name: z.option(z.string()),
status: z.enum([0, 1, 2]), // 0 - private, 1 - public, 2 - exported
displayName: z.option(z.string()),
description: z.option(z.string()),
connectedAt: z.date(),
}).strict();
export const deviceMutablesSchema = deviceSchema.pick({
status: true,
displayName: true,
description: true,
});

10
server/src/lib/errors.ts
View File

@ -164,3 +164,13 @@ export type NotFoundError = InferSchemaType<typeof notFoundErrorSchema>;
export const notAllowedErrorSchema = defineError("NotAllowedError");
export const notAllowedError = createErrorFactory(notAllowedErrorSchema);
export type NotAllowedError = InferSchemaType<typeof notAllowedErrorSchema>;
export const tooManyConnectionErrorSchema = defineError(
"tooManyConnectionError",
);
export const tooManyConnectionError = createErrorFactory(
tooManyConnectionErrorSchema,
);
export type TooManyConnectionError = InferSchemaType<
typeof tooManyConnectionErrorSchema
>;

195
server/src/lib/router.ts
View File

@ -1,5 +1,4 @@
import { RouterTree } from "@src/lib/routerTree.ts";
import { none, some } from "@shared/utils/option.ts";
import { Context } from "@src/lib/context.ts";
import { Schema } from "@shared/utils/validator.ts";
import { Api } from "@src/lib/apiValidator.ts";
@ -7,9 +6,9 @@ import { notAllowedError, notFoundError } from "@src/lib/errors.ts";
import { err } from "@shared/utils/result.ts";
type RequestHandler<
S extends string,
ReqSchema extends Schema<any> = Schema<unknown>,
ResSchema extends Schema<any> = Schema<unknown>,
S extends string = string,
ReqSchema extends Schema<unknown> = Schema<unknown>,
ResSchema extends Schema<unknown> = Schema<unknown>,
> = (c: Context<S, ReqSchema, ResSchema>) => Promise<Response> | Response;
export type Middleware = (
@ -19,24 +18,29 @@ export type Middleware = (
type MethodHandler<S extends string> = {
handler: RequestHandler<S>;
schema?: { req: Schema<any>; res: Schema<any> };
schema?: { req: Schema<unknown>; res: Schema<unknown> };
};
type MethodHandlers<S extends string> = Partial<
type MethodHandlers<S extends string = string> = Partial<
Record<string, MethodHandler<S>>
>;
const DEFAULT_NOT_FOUND_HANDLER =
(() => new Response("404 Not found", { status: 404 })) as RequestHandler<
any
>;
(() => new Response("404 Not found", { status: 404 })) as RequestHandler;
const DEFAULT_NOT_ALLOWED_HANDLER =
((c) =>
c.json(err(notAllowedError("405 Not allowed")), {
status: 405,
})) as RequestHandler;
class HttpRouter {
public readonly routerTree = new RouterTree<MethodHandlers<any>>();
public readonly routerTree = new RouterTree<MethodHandlers>();
public pathTransformer?: (path: string) => string;
private middlewares: Middleware[] = [];
public defaultNotFoundHandler: RequestHandler<string> =
DEFAULT_NOT_FOUND_HANDLER;
public notFoundHandler: RequestHandler = DEFAULT_NOT_FOUND_HANDLER;
public methodNotAllowedHandler: RequestHandler =
DEFAULT_NOT_ALLOWED_HANDLER;
public setPathTransformer(transformer: (path: string) => string) {
this.pathTransformer = transformer;
@ -50,8 +54,8 @@ class HttpRouter {
public add<
S extends string,
ReqSchema extends Schema<any> = Schema<unknown>,
ResSchema extends Schema<any> = Schema<unknown>,
ReqSchema extends Schema<unknown> = Schema<unknown>,
ResSchema extends Schema<unknown> = Schema<unknown>,
>(
path: S,
method: string,
@ -60,8 +64,8 @@ class HttpRouter {
): HttpRouter;
public add<
S extends string,
ReqSchema extends Schema<any> = Schema<unknown>,
ResSchema extends Schema<any> = Schema<unknown>,
ReqSchema extends Schema<unknown> = Schema<unknown>,
ResSchema extends Schema<unknown> = Schema<unknown>,
>(
path: S[],
method: string,
@ -72,7 +76,7 @@ class HttpRouter {
path: string | string[],
method: string,
handler: RequestHandler<string>,
schema?: { req: Schema<any>; res: Schema<any> },
schema?: { req: Schema<unknown>; res: Schema<unknown> },
): HttpRouter {
const paths = Array.isArray(path) ? path : [path];
@ -82,7 +86,7 @@ class HttpRouter {
existingHandlers[method] = { handler, schema };
},
() => {
const newHandlers: MethodHandlers<string> = {};
const newHandlers: MethodHandlers = {};
newHandlers[method] = { handler, schema };
this.routerTree.add(p, newHandlers);
},
@ -98,11 +102,11 @@ class HttpRouter {
): HttpRouter;
public get<S extends string>(
path: S[],
handler: RequestHandler<string>,
handler: RequestHandler,
): HttpRouter;
public get(
path: string | string[],
handler: RequestHandler<string>,
handler: RequestHandler,
): HttpRouter {
if (Array.isArray(path)) {
return this.add(path, "GET", handler);
@ -114,9 +118,9 @@ class HttpRouter {
path: S,
handler: RequestHandler<S>,
): HttpRouter;
public post<S extends string>(
public post(
path: string[],
handler: RequestHandler<string>,
handler: RequestHandler,
): HttpRouter;
public post(
path: string | string[],
@ -130,8 +134,8 @@ class HttpRouter {
public api<
Path extends string,
ReqSchema extends Schema<any>,
ResSchema extends Schema<any>,
ReqSchema extends Schema<unknown>,
ResSchema extends Schema<unknown>,
>(
api: Api<Path, ReqSchema, ResSchema>,
handler: RequestHandler<Path, ReqSchema, ResSchema>,
@ -148,120 +152,77 @@ class HttpRouter {
? this.pathTransformer(ctx.path)
: ctx.path;
let routeParams: Record<string, string> = {};
const { handler, params } = this.resolveRoute(ctx, path);
ctx = ctx.setParams(params);
const handler = this.routerTree
.find(path)
.andThen((match) => {
const { value: methodHandler, params: params } = match;
routeParams = params;
let route = methodHandler[req.method];
if (!route) {
if (req.method === "HEAD") {
const getHandler = methodHandler["GET"];
if (!getHandler) {
return none;
}
route = getHandler;
} else if (
ctx.preferredType.map((v) => v === "json")
.toBoolean() &&
req.method !== "GET"
) {
return some(
(() =>
ctx.json(
err(notAllowedError(
"405 Not allowed",
)),
{
status: 405,
},
)) as RequestHandler<any>,
);
}
return none;
}
if (route.schema) {
ctx = ctx.setSchema(route.schema);
}
const handler = route.handler;
return some(handler);
})
.unwrapOrElse(() => {
switch (ctx.preferredType.unwrapOr("other")) {
case "json":
return (() =>
ctx.json(err(notFoundError("404 Not found")), {
status: 404,
})) as RequestHandler<any>;
case "html":
return (() =>
ctx.html("404 Not found", {
status: 404,
})) as RequestHandler<any>;
case "other":
return DEFAULT_NOT_FOUND_HANDLER;
}
});
const res = (await this.executeMiddlewareChain(
this.middlewares,
handler,
ctx = ctx.setParams(routeParams),
)).res;
if (req.method === "HEAD") {
const headers = new Headers(res.headers);
headers.set("Content-Length", "0");
return new Response(null, {
headers,
status: res.status,
statusText: res.statusText,
});
}
return res;
const res =
(await this.runMiddlewares(this.middlewares, handler, ctx)).res;
return req.method === "HEAD" ? this.removeBodyFromResponse(res) : res;
}
private resolveRoute(
ctx: Context,
req: Request,
path: string,
): { handler: RequestHandler<any>; params: Record<string, string> } {
): { handler: RequestHandler; params: Record<string, string> } {
const routeOption = this.routerTree.find(path);
if (routeOption.isSome()) {
const { value: methodHandlers, params } = routeOption.value;
let route = methodHandlers[ctx.req.method];
if (!route && ctx.req.method === "HEAD") {
route = methodHandlers["GET"];
} else if (!route && ctx.req.method !== "GET") {
if (ctx.preferredType.map((v) => v === "json").toBoolean()) {
return { handler: this.methodNotAllowedHandler, params };
}
}
if (route) {
if (route.schema) {
ctx = ctx.setSchema(route.schema);
}
return { handler: route.handler, params };
}
}
return { handler: this.notFoundHandler, params: {} };
}
private async executeMiddlewareChain<S extends string>(
private removeBodyFromResponse(res: Response): Response {
const headers = new Headers(res.headers);
headers.set("Content-Length", "0");
return new Response(null, {
headers,
status: res.status,
statusText: res.statusText,
});
}
private async runMiddlewares(
middlewares: Middleware[],
handler: RequestHandler<S>,
c: Context<S>,
handler: RequestHandler,
ctx: Context,
) {
let currentIndex = -1;
const dispatch = async (index: number): Promise<void> => {
currentIndex = index;
if (index < middlewares.length) {
const middleware = middlewares[index];
const result = await middleware(c, () => dispatch(index + 1));
const result = await middleware(ctx, () => dispatch(index + 1));
if (result !== undefined) {
c.res = await Promise.resolve(result);
ctx.res = await Promise.resolve(result);
}
} else {
const res = await handler(c);
c.res = res;
ctx.res = await handler(ctx);
}
};
await dispatch(0);
return ctx;
}
return c;
private buildNotFoundHandler(c: Context) {
return c.matchPreferredType(
() => c.html("404 Not found", { status: 404 }),
() => c.json(err(notFoundError("404 Not found")), { status: 404 }),
() => new Response("404 Not found", { status: 404 }),
);
}
}

38
server/src/lib/websocket.ts Normal file
View File

@ -0,0 +1,38 @@
import {
TooManyConnectionError,
tooManyConnectionError,
} from "@src/lib/errors.ts";
import { err, ok, Result } from "@shared/utils/result.ts";
const MAX_CONNECTIONS_PER_TOKEN = 2;
const MAX_CONNECTIONS = 500;
class WebSocketManager {
private adminSockets: Map<string, WebSocket[]> = new Map();
private userSockets: Map<string, WebSocket[]> = new Map();
private connectionsCounter: number = 0;
public addAdminClient(
token: string,
socket: WebSocket,
): Result<void, TooManyConnectionError> {
if (this.connectionsCounter > MAX_CONNECTIONS) {
return err(tooManyConnectionError("Too many connections"));
}
const sockets = this.adminSockets.get(token);
if (!sockets) {
const sockets = [socket];
this.adminSockets.set(token, sockets);
this.connectionsCounter++;
return ok();
} else if (sockets.length < MAX_CONNECTIONS_PER_TOKEN) {
sockets.push(socket);
this.connectionsCounter++;
return ok();
} else {
return err(tooManyConnectionError("Too many connections"));
}
}
}

186
server/src/lib/wsClient.ts Normal file
View File

@ -0,0 +1,186 @@
import { none, type Option, some } from "@shared/utils/option.ts";
import { errAsync, okAsync, ResultAsync } from "@shared/utils/resultasync.ts";
import { InferSchemaType, Schema, z } from "@shared/utils/validator.ts";
const CONNECTION_TIMEOUT_MS = 2000;
const PING_INTERVAL_MS = 1000;
const PING_CHECK_INTERVAL_MS = 15000;
const MAX_PING_ATTEMPTS = 5;
const MAX_RECONNECTION_ATTEMPTS = 5;
export class WebSocketWrapper<
R extends Schema<any> = Schema<unknown>,
S extends Schema<any> = Schema<unknown>,
> {
private _ws: Option<WebSocket> = none;
get ws(): Option<WebSocket> {
return this._ws;
}
set ws(ws: Option<WebSocket>) {
this._ws = ws;
if (ws.isSome()) {
ws.value.addEventListener("close", this.handleWebSocketClose);
ws.value.addEventListener("error", this.handleWebSocketError);
ws.value.addEventListener("message", this.onMessage!);
this.onConnectSucc!();
this.pingAndWait();
} else {
this.onDisconnect!();
}
}
private handleWebSocketClose = () => {
this._ws = none;
this.connect();
};
private handleWebSocketError = () => {
this._ws = none;
this.connect();
};
private pingAndWait = async () => {
const r = await this.ping();
if (r.isErr()) {
clearTimeout(this.pingTimer);
this.ws = none;
}
this.pingTimer = setTimeout(this.pingAndWait, PING_CHECK_INTERVAL_MS);
};
private pingTimer?: number;
public onConnectInit?: () => void;
public onConnectSucc?: () => void;
public onConnectFail?: () => void;
public onDisconnect?: () => void;
public onMessage?: (ev: MessageEvent<any>) => void;
private isConnecting = false;
constructor(
public readonly url: string,
public readonly schema: {
receive: R;
send: S;
},
private readonly timeout = CONNECTION_TIMEOUT_MS,
private readonly pingInterval = PING_INTERVAL_MS,
) {}
public ping(): ResultAsync<void, void> {
if (this.ws.isNone()) {
return errAsync();
}
const ws = this.ws.value;
return ResultAsync.from((resolve, reject) => {
let timer: number;
const listener = (e: MessageEvent<any>) => {
if (e.data === "pong") {
ws.removeEventListener("message", listener);
clearTimeout(timer);
resolve();
}
};
ws.addEventListener("message", listener);
let attempts = 0;
const pingAndWait = () => {
if (++attempts > MAX_PING_ATTEMPTS) reject();
ws.send("ping");
timer = setTimeout(pingAndWait, this.pingInterval);
};
pingAndWait();
});
}
private createWebSocketConnection(): ResultAsync<WebSocket, void> {
const ws = new WebSocket(this.url);
return ResultAsync.from((resolve, reject) => {
const handleError = () => {
reject();
};
ws.addEventListener("open", () => {
ws.removeEventListener("error", handleError);
resolve(ws);
});
ws.addEventListener("error", handleError);
});
}
public connect(): ResultAsync<void, void> {
if (this.isConnecting) {
return errAsync();
}
return ResultAsync.fromSafePromise(
this.ping().match(
() => okAsync(),
() => {
this.isConnecting = true;
this.onConnectInit!();
this.tryReconnect();
},
),
).flatten();
}
private tryReconnect(): ResultAsync<void, void> {
return ResultAsync.from((resolve, reject) => {
let attempt = 0;
let timer: number;
const tryConnect = async () => {
console.log(`attempt ${attempt + 1}`);
if (++attempt >= MAX_RECONNECTION_ATTEMPTS) {
this.onConnectFail!();
this.isConnecting = false;
console.error("Failed to connect");
reject();
return;
}
const ws = await this.createWebSocketConnection();
if (ws.isOk()) {
this.ws = some(ws.value);
clearTimeout(timer);
this.isConnecting = false;
resolve();
} else {
timer = setTimeout(
tryConnect,
this.timeout,
);
}
};
tryConnect();
});
}
send(data: InferSchemaType<S>): ResultAsync<void, void> {
if (this.ws.isNone()) {
return errAsync();
}
}
}
const sendSchema = z.obj({
id: z.number(),
kind: z.enum(["up"]),
});

17
server/src/views/index.html
View File

@ -1,13 +1,10 @@
<% layout("./layouts/layout.html") %>
devices:
<% it.devices.forEach(function(device){ %>
<div>
name: <%= device.name %> | <%= device.vendor %>
busid: <%= device.busid %>
</div>
<%= device.busid %>
<% }) %>
<div id="devices_grid">
</div>
<button id="ping">ping</button>
<div id="info"></div>
<script src="/public/js/index.js" defer></script>
<button id="ping">ping</button>
<button id="reconnect">reconnect</button>
<script src="/public/js/index.js" type="module" defer></script>

BIN
server/test.db
View File

Binary file not shown.

2
server/views/index.html
View File

@ -1 +1 @@
<% layout("./layouts/layout.html") %> devices: <% it.devices.forEach(function(device){ %> <div>name: <%= device.name %> | <%= device.vendor %> busid: <%= device.busid %></div> <%= device.busid %> <% }) %> <button id=ping>ping</button><script defer src=/public/js/index.js></script>
<% layout("./layouts/layout.html") %> <div id=devices_grid></div><div id=info></div><button id=ping>ping</button><button id=reconnect>reconnect</button><script defer src=/public/js/index.js type=module></script>

12
shared/utils/resultasync.ts
View File

@ -62,6 +62,18 @@ export class ResultAsync<T, E> implements PromiseLike<Result<T, E>> {
};
}
static from<
T = void,
E = void,
>(
executor: (
resolve: (value: T | PromiseLike<T>) => void,
reject: (reason?: E) => void,
) => void,
): ResultAsync<T, E> {
return ResultAsync.fromPromise(new Promise(executor), (e) => e as E);
}
async unwrap(): Promise<T> {
const result = await this._promise;
if (result.isErr()) {

30
shared/utils/validator.ts
View File

@ -1178,6 +1178,34 @@ export class OptionSchema<T extends Schema<any>>
}
}
export class EnumSchema<E extends (number | string)[]>
extends BaseSchema<E[number]> {
constructor(
public readonly entries: E,
msg?: string,
) {
super(msg);
}
protected override validateInput(
input: unknown,
): Result<E[number], SchemaValidationError> {
for (const entry of this.entries) {
if (input === entry) {
return ok(input as E[number]);
}
}
return err(createValidationError(input, {
kind: "typeMismatch",
expected: this.entries.map((e) =>
typeof e === "string" ? `"${e}"` : e
).join(" | "),
received: String(input),
msg: this.msg,
}));
}
}
/* ── Helper Object for Schema Creation (z) ───────────────────────────────────── */
export const z = {
@ -1235,6 +1263,8 @@ export const z = {
option: <T extends Schema<any>>(
schema: T,
) => new OptionSchema<T>(schema),
enum: <E extends (number | string)[]>(e: E, msg?: string) =>
new EnumSchema(e, msg),
};
export type InferSchemaType<S> = S extends Schema<infer T> ? T : never;