mirror of
https://github.com/Dokploy/dokploy
synced 2025-06-26 18:27:59 +00:00
refactor: remove sockets
This commit is contained in:
parent
179de344c2
commit
14e8e14b7d
@ -25,7 +25,9 @@ const chartConfig = {
|
||||
} satisfies ChartConfig;
|
||||
|
||||
export const RequestDistributionChart = () => {
|
||||
const { data: stats } = api.settings.readStats.useQuery();
|
||||
const { data: stats } = api.settings.readStats.useQuery(undefined, {
|
||||
refetchInterval: 1333,
|
||||
});
|
||||
|
||||
return (
|
||||
<ResponsiveContainer width="100%" height={200}>
|
||||
|
@ -10,7 +10,7 @@ import {
|
||||
type VisibilityState,
|
||||
flexRender,
|
||||
} from "@tanstack/react-table";
|
||||
import { useCallback, useEffect, useMemo, useRef, useState } from "react";
|
||||
import { useMemo, useState } from "react";
|
||||
import type { LogEntry } from "./show-requests";
|
||||
import { Badge } from "@/components/ui/badge";
|
||||
import {
|
||||
@ -78,10 +78,6 @@ export const priorities = [
|
||||
},
|
||||
];
|
||||
export const RequestsTable = () => {
|
||||
const [statsLogs, setStatsLogs] = useState<{
|
||||
data: LogEntry[];
|
||||
totalCount: number;
|
||||
}>();
|
||||
const [statusFilter, setStatusFilter] = useState<string[]>([]);
|
||||
const [search, setSearch] = useState("");
|
||||
const [selectedRow, setSelectedRow] = useState<LogEntry>();
|
||||
@ -94,93 +90,17 @@ export const RequestsTable = () => {
|
||||
pageSize: 10,
|
||||
});
|
||||
|
||||
// const { data: statsLogs, isLoading } = api.settings.readStatsLogs.useQuery({
|
||||
// sort: sorting[0],
|
||||
// page: pagination,
|
||||
// search,
|
||||
// status: statusFilter,
|
||||
// });
|
||||
|
||||
// useEffect(() => {
|
||||
// const protocol = window.location.protocol === "https:" ? "wss:" : "ws:";
|
||||
|
||||
// const wsUrl = `${protocol}//${window.location.host}/request-logs`;
|
||||
// const ws = new WebSocket(wsUrl);
|
||||
|
||||
// ws.onopen = () => {
|
||||
// // Enviar parámetros iniciales
|
||||
// ws.send(
|
||||
// JSON.stringify({
|
||||
// page: pagination,
|
||||
// sort: sorting[0],
|
||||
// search: search,
|
||||
// status: statusFilter,
|
||||
// }),
|
||||
// );
|
||||
// };
|
||||
|
||||
// ws.onmessage = (event) => {
|
||||
// const data = JSON.parse(event.data);
|
||||
// setStatsLogs(data);
|
||||
// };
|
||||
|
||||
// // return () => ws.close();
|
||||
// }, [pagination, search, sorting, statusFilter]);
|
||||
const wsRef = useRef<WebSocket | null>(null);
|
||||
const isInitialMount = useRef(true);
|
||||
|
||||
const sendParams = useCallback(() => {
|
||||
if (wsRef.current && wsRef.current.readyState === WebSocket.OPEN) {
|
||||
wsRef.current.send(
|
||||
JSON.stringify({
|
||||
page: pagination,
|
||||
sort: sorting[0],
|
||||
search: search,
|
||||
status: statusFilter,
|
||||
}),
|
||||
);
|
||||
} else {
|
||||
console.log("WebSocket not ready, retrying in 100ms");
|
||||
setTimeout(sendParams, 100); // Retry after 100ms
|
||||
}
|
||||
}, [pagination, sorting, search, statusFilter]);
|
||||
|
||||
useEffect(() => {
|
||||
const protocol = window.location.protocol === "https:" ? "wss:" : "ws:";
|
||||
const wsUrl = `${protocol}//${window.location.host}/request-logs`;
|
||||
const newWs = new WebSocket(wsUrl);
|
||||
|
||||
newWs.onopen = () => {
|
||||
console.log("WebSocket connection established");
|
||||
wsRef.current = newWs;
|
||||
sendParams(); // Send initial params as soon as the connection is open
|
||||
};
|
||||
|
||||
newWs.onmessage = (event) => {
|
||||
const data = JSON.parse(event.data);
|
||||
setStatsLogs(data);
|
||||
};
|
||||
|
||||
newWs.onerror = (error) => {
|
||||
console.error("WebSocket error:", error);
|
||||
};
|
||||
|
||||
newWs.onclose = () => {
|
||||
console.log("WebSocket connection closed");
|
||||
};
|
||||
|
||||
return () => {
|
||||
newWs.close();
|
||||
};
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
if (isInitialMount.current) {
|
||||
isInitialMount.current = false;
|
||||
} else {
|
||||
sendParams();
|
||||
}
|
||||
}, [sendParams]);
|
||||
const { data: statsLogs, isLoading } = api.settings.readStatsLogs.useQuery(
|
||||
{
|
||||
sort: sorting[0],
|
||||
page: pagination,
|
||||
search,
|
||||
status: statusFilter,
|
||||
},
|
||||
{
|
||||
refetchInterval: 1333,
|
||||
},
|
||||
);
|
||||
|
||||
const pageCount = useMemo(() => {
|
||||
if (statsLogs?.totalCount) {
|
||||
|
@ -23,7 +23,6 @@ import {
|
||||
getPublicIpWithFallback,
|
||||
setupTerminalWebSocketServer,
|
||||
} from "./wss/terminal";
|
||||
import { setupRequestLogsWebSocketServer } from "./wss/requests-logs";
|
||||
|
||||
config({ path: ".env" });
|
||||
const PORT = Number.parseInt(process.env.PORT || "3000", 10);
|
||||
@ -40,7 +39,6 @@ void app.prepare().then(async () => {
|
||||
setupDeploymentLogsWebSocketServer(server);
|
||||
setupDockerContainerLogsWebSocketServer(server);
|
||||
setupDockerContainerTerminalWebSocketServer(server);
|
||||
setupRequestLogsWebSocketServer(server);
|
||||
setupTerminalWebSocketServer(server);
|
||||
setupDockerStatsMonitoringSocketServer(server);
|
||||
|
||||
|
@ -1,79 +0,0 @@
|
||||
import type http from "node:http";
|
||||
import { WebSocketServer } from "ws";
|
||||
import { validateWebSocketRequest } from "../auth/auth";
|
||||
import { readMonitoringConfig } from "../utils/traefik/application";
|
||||
import { parseRawConfig } from "../utils/access-log/utils";
|
||||
import { apiReadStatsLogs } from "../db/schema";
|
||||
import fs from "node:fs";
|
||||
import path from "node:path";
|
||||
import { DYNAMIC_TRAEFIK_PATH } from "../constants";
|
||||
|
||||
export const setupRequestLogsWebSocketServer = (
|
||||
server: http.Server<typeof http.IncomingMessage, typeof http.ServerResponse>,
|
||||
) => {
|
||||
const wssTerm = new WebSocketServer({
|
||||
noServer: true,
|
||||
path: "/request-logs",
|
||||
});
|
||||
|
||||
server.on("upgrade", (req, socket, head) => {
|
||||
const { pathname } = new URL(req.url || "", `http://${req.headers.host}`);
|
||||
|
||||
if (pathname === "/_next/webpack-hmr") {
|
||||
return;
|
||||
}
|
||||
if (pathname === "/request-logs") {
|
||||
wssTerm.handleUpgrade(req, socket, head, function done(ws) {
|
||||
wssTerm.emit("connection", ws, req);
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
const broadcastUpdate = (input: any) => {
|
||||
const rawConfig = readMonitoringConfig();
|
||||
const parsedConfig = parseRawConfig(
|
||||
rawConfig as string,
|
||||
input.page,
|
||||
input.sort,
|
||||
input.search,
|
||||
input.status,
|
||||
);
|
||||
|
||||
return parsedConfig;
|
||||
};
|
||||
|
||||
const configPath = path.join(DYNAMIC_TRAEFIK_PATH, "access.log");
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/no-misused-promises
|
||||
wssTerm.on("connection", async (ws, req) => {
|
||||
const { user, session } = await validateWebSocketRequest(req);
|
||||
|
||||
if (!user || !session) {
|
||||
ws.close();
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
ws.on("message", (message: string) => {
|
||||
try {
|
||||
const input = apiReadStatsLogs.parse(JSON.parse(message));
|
||||
const parsedConfig = broadcastUpdate(input);
|
||||
ws.send(JSON.stringify(parsedConfig));
|
||||
|
||||
fs.watch(configPath, (eventType) => {
|
||||
if (eventType === "change") {
|
||||
const parsedConfig = broadcastUpdate(input);
|
||||
ws.send(JSON.stringify(parsedConfig));
|
||||
}
|
||||
});
|
||||
} catch (error) {
|
||||
ws.send(JSON.stringify({ error: "Invalid message format" }));
|
||||
}
|
||||
});
|
||||
} catch (error) {
|
||||
const errorMessage = (error as Error)?.message;
|
||||
console.log(errorMessage);
|
||||
ws.send(errorMessage);
|
||||
}
|
||||
});
|
||||
};
|
Loading…
Reference in New Issue
Block a user