OPCUA Status und Name Lesen

components/modales/settingsModal/SettingsModal.tsx

@@ -1,18 +1,17 @@
-"use client"; //components/modales/settingsModal/SettingsModal.jsx
+"use client"; // components/modales/settingsModal/SettingsModal.jsx
 import React, { useState, useEffect } from "react";
 import ReactModal from "react-modal";
-import { ClipLoader } from "react-spinners";
 import "bootstrap-icons/font/bootstrap-icons.css";
-import { useSelector, useDispatch } from "react-redux";
+import { useSelector } from "react-redux";
 import handleClearDatabase from "./handlers/handleClearDatabase";
 import handleReboot from "./handlers/handleReboot";
 import handleSetDateTime from "./handlers/handleSetDateTime";
 import handleSubmit from "./handlers/handleSubmit";
-import { useRouter } from "next/router";
-
 import bcrypt from "bcryptjs";
+import CryptoJS from "crypto-js";
 
 ReactModal.setAppElement("#__next");
+
 const USERS = {
   Admin: {
     username: "admin",
@@ -21,7 +20,22 @@ const USERS = {
     role: "Admin",
   },
 };
-// Function to generate JWT token
+
+// Funktion zur Generierung eines AES-Schlüssels und IVs
+function generateKeyAndIV() {
+  const encryptionKey = process.env.NEXT_PUBLIC_ENCRYPTION_KEY;
+  const encryptionIV = process.env.NEXT_PUBLIC_ENCRYPTION_IV;
+
+  if (!encryptionKey || !encryptionIV) {
+    throw new Error("Encryption key or IV is not defined.");
+  }
+
+  const key = CryptoJS.enc.Utf8.parse(encryptionKey);
+  const iv = CryptoJS.enc.Utf8.parse(encryptionIV);
+  return { key, iv };
+}
+
+// Funktion zur Generierung eines Tokens
 function generateToken(user) {
   const payload = {
     username: user.username,
@@ -29,40 +43,34 @@ function generateToken(user) {
     exp: Date.now() + 5 * 60 * 1000, // Ablaufzeit: 5 Minuten
   };
   const token = JSON.stringify(payload);
-  const encryptedToken = CryptoJS.AES.encrypt(
-    token,
-    process.env.NEXT_PUBLIC_ENCRYPTION_KEY
-  ).toString();
+  const { key, iv } = generateKeyAndIV();
+  const encryptedToken = CryptoJS.AES.encrypt(token, key, { iv }).toString();
   return encryptedToken;
 }
+
+// Funktion zur Entschlüsselung des Tokens
 function decryptToken(encryptedToken) {
-  const bytes = CryptoJS.AES.decrypt(
-    encryptedToken,
-    process.env.NEXT_PUBLIC_ENCRYPTION_KEY
-  );
+  const { key, iv } = generateKeyAndIV();
+  const bytes = CryptoJS.AES.decrypt(encryptedToken, key, { iv });
   const decryptedToken = bytes.toString(CryptoJS.enc.Utf8);
   return JSON.parse(decryptedToken);
 }
 
 function SettingModal({ showModal, onClose }) {
   const [isAdminLoggedIn, setAdminLoggedIn] = useState(false);
-  //const isAdminLoggedIn = sessionStorage.getItem("token");
-
   const [username, setUsername] = useState("");
   const [password, setPassword] = useState("");
   const [error, setError] = useState("");
-  const [showLoginForm, setShowLoginForm] = useState(false); // Zustand für Login-Formular
-  const router = useRouter();
+  const [showLoginForm, setShowLoginForm] = useState(false);
 
   function handleAdminLogin(e) {
     e.preventDefault();
-    const user = USERS.Admin; // Finde den Admin-Benutzer
+    const user = USERS.Admin;
     bcrypt.compare(password, user.password, (err, isMatch) => {
       if (isMatch) {
         const token = generateToken(user);
-        sessionStorage.setItem("token", token); // Speichere Token in SessionStorage
+        sessionStorage.setItem("token", token);
         localStorage.setItem("isAdminLoggedIn", "true");
-
         setShowLoginForm(false);
         onClose();
       } else {
@@ -72,6 +80,25 @@ function SettingModal({ showModal, onClose }) {
       }
     });
   }
+
+  useEffect(() => {
+    if (showModal) {
+      const token = sessionStorage.getItem("token");
+      if (token) {
+        try {
+          const { exp } = decryptToken(token);
+          if (Date.now() < exp) {
+            setAdminLoggedIn(true);
+          } else {
+            sessionStorage.removeItem("token");
+            localStorage.setItem("isAdminLoggedIn", "false");
+          }
+        } catch (error) {
+          console.error("Token-Entschlüsselung fehlgeschlagen:", error);
+        }
+      }
+    }
+  }, [showModal]);
   const deviceName_Redux = useSelector((state) => state.variables.deviceName);
   const mac1_Redux = useSelector((state) => state.variables.mac1);
   const ip_Redux = useSelector((state) => state.variables.ip);
@@ -154,16 +181,30 @@ function SettingModal({ showModal, onClose }) {
     ntpTimezone_Redux,
     active_Redux,
   ]);
+
   useEffect(() => {
-    // Check if a valid token exists in localStorage
+    // Überprüfen, ob ein Token im SessionStorage vorhanden ist
     const token = sessionStorage.getItem("token");
     if (token) {
-      setAdminLoggedIn(true);
-      const { exp } = JSON.parse(atob(token));
-      if (Date.now() < exp) {
-        setAdminLoggedIn(true);
-      } else {
-        // localStorage.removeItem("token"); // Remove expired token
+      try {
+        // Token mit CryptoJS entschlüsseln
+        const bytes = CryptoJS.AES.decrypt(
+          token,
+          process.env.NEXT_PUBLIC_ENCRYPTION_KEY
+        );
+        const decryptedToken = JSON.parse(bytes.toString(CryptoJS.enc.Utf8));
+
+        // Ablaufzeit überprüfen
+        if (Date.now() < decryptedToken.exp) {
+          setAdminLoggedIn(true);
+        } else {
+          // Token ist abgelaufen
+          sessionStorage.removeItem("token");
+          setAdminLoggedIn(false);
+        }
+      } catch (error) {
+        console.error("Fehler beim Entschlüsseln des Tokens:", error);
+        setAdminLoggedIn(false);
       }
     }
   }, []);