socket connect manage

This commit is contained in:
Julian Krauser 2025-02-25 18:35:17 +01:00
parent 49121fba9b
commit 7d703928a1
2 changed files with 39 additions and 15 deletions

View file

@ -91,7 +91,7 @@ const router = createRouter({
{ {
path: "", path: "",
name: "admin-operation-default", name: "admin-operation-default",
redirect: { name: "admin-operation-mission" }, redirect: { name: "admin-operation-mission-default" },
}, },
{ {
path: "mission", path: "mission",
@ -104,14 +104,14 @@ const router = createRouter({
path: "", path: "",
name: "admin-operation-mission-default", name: "admin-operation-mission-default",
component: () => import("@/views/admin/operation/mission/MissionList.vue"), component: () => import("@/views/admin/operation/mission/MissionList.vue"),
meta: { type: "read", section: "operation" }, meta: { type: "read", section: "operation", module: "mission" },
beforeEnter: [abilityAndNavUpdate], beforeEnter: [abilityAndNavUpdate],
}, },
{ {
path: ":id", path: ":id",
name: "admin-operation-mission-form", name: "admin-operation-mission-form",
component: () => import("@/views/admin/operation/mission/MissionOverview.vue"), component: () => import("@/views/admin/operation/mission/MissionOverview.vue"),
meta: { type: "read", section: "operation", module: "force" }, meta: { type: "read", section: "operation", module: "mission" },
beforeEnter: [abilityAndNavUpdate], beforeEnter: [abilityAndNavUpdate],
}, },
], ],

View file

@ -1,7 +1,7 @@
import { defineStore } from "pinia"; import { defineStore } from "pinia";
import { io, type Socket } from "socket.io-client"; import { io, type Socket } from "socket.io-client";
import { useNotificationStore } from "../../notification"; import { useNotificationStore } from "../../notification";
import { url } from "../../../serverCom"; import { refreshToken, url } from "../../../serverCom";
export const useConnectionStore = defineStore("connection", { export const useConnectionStore = defineStore("connection", {
state: () => { state: () => {
@ -20,16 +20,16 @@ export const useConnectionStore = defineStore("connection", {
this.connection = io(url, { this.connection = io(url, {
reconnection: true, reconnection: true,
reconnectionDelayMax: 10000, reconnectionDelayMax: 10000,
auth: { auth: (cb) => {
token: localStorage.getItem("accessToken"), cb({ token: localStorage.getItem("accessToken") });
}, },
}); });
this.connection.on("connect", () => { this.connection.on("connect", () => {
notificationStore.push("Erfolg", `Verbindung aufgebaut`, "success"); notificationStore.push("Socket-Erfolg", `Verbindung aufgebaut`, "success");
}); });
this.connection.on("connect_error", () => { this.connection.on("connect_error", (err) => {
notificationStore.push("Fehler", `Verbindung fehlgeschlagen`, "error"); this.handleError(err, true);
}); });
this.connection.on("disconnecting", () => { this.connection.on("disconnecting", () => {
this.connection?.disconnect(); this.connection?.disconnect();
@ -38,26 +38,50 @@ export const useConnectionStore = defineStore("connection", {
this.$reset(); this.$reset();
}); });
this.connection.on("warning", (msg: string) => { this.connection.on("warning", (msg: string) => {
notificationStore.push("Warnung", msg, "warning"); notificationStore.push("Socket-Warnung", msg, "warning");
}); });
this.connection.on("error", (msg: string) => { this.connection.on("error", (msg: string) => {
notificationStore.push("Fehler", msg, "error"); this.handleError({
name: "Error",
message: msg,
});
}); });
this.connection.on("reconnect", (attemptNumber) => { this.connection.on("reconnect", (attemptNumber) => {
notificationStore.push("Reconnect", `Reconnect erfolgreich`, "success"); notificationStore.push("Socket-Reconnect", `Reconnect erfolgreich`, "success");
}); });
this.connection.on("reconnect_attempt", (attemptNumber) => { this.connection.on("reconnect_attempt", (attemptNumber) => {
notificationStore.push("Reconnect-Versuch", `Reconnect-Versuch Nr.${attemptNumber}`, "info"); notificationStore.push("Socket-Reconnect-Versuch", `Reconnect-Versuch Nr.${attemptNumber}`, "info");
}); });
this.connection.on("reconnect_error", (error) => { this.connection.on("reconnect_error", (error) => {
notificationStore.push("Warnung", "Reconnect fehlgeschlagen", "warning"); notificationStore.push("Socket-Warnung", "Reconnect fehlgeschlagen", "warning");
}); });
this.connection.on("reconnect_failed", () => { this.connection.on("reconnect_failed", () => {
notificationStore.push("Fehler", "Reconnect-Versuche erfolglos beendet", "error"); notificationStore.push("Socket-Fehler", "Reconnect-Versuche erfolglos beendet", "error");
}); });
}, },
disconnectClient(): void { disconnectClient(): void {
this.connection?.disconnect(); this.connection?.disconnect();
}, },
handleError(err: Error, onConnect = false) {
const notificationStore = useNotificationStore();
if (err.message == "xhr poll error") {
notificationStore.push("Socket-Netzwerk-Fehler", "Reconnect Versuch in 10s", "error");
} else if (err.message == "Token expired") {
notificationStore.push("Session", "Session wird verlängert", "info");
refreshToken()
.then(() => {
notificationStore.push("Session", "Session erfolgreich verlängert", "success");
this.connection?.disconnect().connect();
})
.catch(() => {
notificationStore.push("Session-Fehler", "Anmeldung wurde nicht verlängert", "error");
});
} else if (onConnect) {
notificationStore.push("Socket-Fehler", `Verbindung fehlgeschlagen`, "error");
} else {
notificationStore.push("Socket-Fehler", err.message, "error");
}
},
}, },
}); });