From 8412d0b9c22ac320f39426079f8f326733639e52 Mon Sep 17 00:00:00 2001 From: ISA Date: Wed, 13 Nov 2024 11:55:48 +0100 Subject: [PATCH] =?UTF-8?q?feat:=20JWT-basierte=20Token-Generierung=20und?= =?UTF-8?q?=20-Validierung=20f=C3=BCr=20rollenbasierte=20UI-Zugriffe=20hin?= =?UTF-8?q?zugef=C3=BCgt?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - `generateToken`-Funktion implementiert, um Tokens mit Benutzerrollen zu erstellen - `decodeToken` in `KueModal` hinzugefügt, um das Token zu dekodieren und den "Firmware Update"-Button für Admin-Rolle bedingt anzuzeigen - Fehlerbehandlung für ungültige Tokens in localStorage verbessert - Sicherstellung der Token-Dekodierung für Admin-Zugriffskontrolle in Entwicklungs- und Produktionsumgebung --- components/modales/kueModal/KueModal.jsx | 27 +++ components/modules/Kue705FO.jsx | 6 +- package-lock.json | 223 ++++++++++++++++++----- package.json | 2 + pages/index.js | 61 ++++++- pages/kabelueberwachung.js | 10 +- 6 files changed, 266 insertions(+), 63 deletions(-) diff --git a/components/modales/kueModal/KueModal.jsx b/components/modales/kueModal/KueModal.jsx index 0daeab4..b4b6349 100644 --- a/components/modales/kueModal/KueModal.jsx +++ b/components/modales/kueModal/KueModal.jsx @@ -8,7 +8,18 @@ import handleSave from "./handlers/handleSave"; import handleDisplayEinschalten from "./handlers/handleDisplayEinschalten"; import handleChange from "./handlers/handleChange"; +function decodeToken(token) { + try { + const payload = JSON.parse(atob(token)); // Direkt das Token decodieren + return payload; + } catch (error) { + console.error("Fehler beim Dekodieren des Tokens:", error); + return null; + } +} + function KueModal({ showModal, onClose, slot, onModulNameChange }) { + const [isAdmin, setIsAdmin] = useState(false); const dispatch = useDispatch(); const [ids, setIds] = useState(Array(32).fill("---")); const [bezeichnungen, setBezeichnungen] = useState(Array(32).fill("---")); @@ -84,6 +95,16 @@ function KueModal({ showModal, onClose, slot, onModulNameChange }) { } }, [showModal]); // nur von showModal abhängig ansonsten wird alle 10 Sekunden die Werte zurückgesetzt in Modal //------------------------------------------------------------------------------------------------------------ + useEffect(() => { + const token = localStorage.getItem("token"); + if (token) { + const decoded = decodeToken(token); + if (decoded && decoded.role === "Admin") { + setIsAdmin(true); + } + } + }, [showModal]); + //------------------------------------------------------------------------------------------------------------ return (
+ {/* Bedingte Anzeige der Firmware-Update-Schaltfläche */} + {isAdmin && ( + + )} + {error &&

{error}

} + + ); } diff --git a/pages/kabelueberwachung.js b/pages/kabelueberwachung.js index 1d380b8..367822d 100644 --- a/pages/kabelueberwachung.js +++ b/pages/kabelueberwachung.js @@ -53,7 +53,7 @@ function Kabelueberwachung() { kueOnlineStatus: kueOnline[index], alarmStatus: alarmStatus[index], })); - console.log("Alle Module:", allModules); + //console.log("Alle Module:", allModules); const racks = { rack1: allModules.slice(0, 8), @@ -63,7 +63,7 @@ function Kabelueberwachung() { }; // Konsolenausgaben für jede Rack-Aufteilung - console.log( + /* console.log( "Rack 1 Module:", racks.rack1.map((slot) => slot.modulName) ); @@ -78,7 +78,7 @@ function Kabelueberwachung() { console.log( "Rack 4 Module:", racks.rack4.map((slot) => slot.modulName) - ); + ); */ // Funktion zum Wechseln des Racks const changeRack = (rack) => { @@ -87,11 +87,11 @@ function Kabelueberwachung() { }; useEffect(() => { - console.log(`Aktives Rack: ${activeRack}`); + /* console.log(`Aktives Rack: ${activeRack}`); console.log( `Rack ${activeRack} Modulnamen:`, racks[`rack${activeRack}`].map((slot) => slot.modulName) - ); + ); */ }, [activeRack, racks]); return (