8412d0b9c2
- `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
59 lines
1.5 KiB
JavaScript
59 lines
1.5 KiB
JavaScript
import { useState } from "react";
|
|
import { useRouter } from "next/router";
|
|
|
|
const USERS = {
|
|
Admin: { username: "Admin", password: "adminpasswort", role: "Admin" },
|
|
Techniker: {
|
|
username: "Techniker",
|
|
password: "technikerpasswort",
|
|
role: "Techniker",
|
|
},
|
|
};
|
|
|
|
function generateToken(user) {
|
|
const payload = {
|
|
username: user.username,
|
|
role: user.role,
|
|
exp: Date.now() + 5 * 60 * 1000, // Ablauf in 5 Minuten
|
|
};
|
|
return btoa(JSON.stringify(payload)); // Verwende btoa nur für das Payload
|
|
}
|
|
|
|
export default function Home() {
|
|
const router = useRouter();
|
|
const [username, setUsername] = useState("");
|
|
const [password, setPassword] = useState("");
|
|
const [error, setError] = useState("");
|
|
|
|
const handleLogin = (e) => {
|
|
e.preventDefault();
|
|
const user = USERS[username];
|
|
if (user && user.password === password) {
|
|
const token = generateToken(user);
|
|
localStorage.setItem("token", token);
|
|
router.replace("/dashboard");
|
|
} else {
|
|
setError("Login fehlgeschlagen");
|
|
}
|
|
};
|
|
|
|
return (
|
|
<form onSubmit={handleLogin}>
|
|
<input
|
|
type="text"
|
|
placeholder="Benutzername"
|
|
value={username}
|
|
onChange={(e) => setUsername(e.target.value)}
|
|
/>
|
|
<input
|
|
type="password"
|
|
placeholder="Passwort"
|
|
value={password}
|
|
onChange={(e) => setPassword(e.target.value)}
|
|
/>
|
|
<button type="submit">Login</button>
|
|
{error && <p>{error}</p>}
|
|
</form>
|
|
);
|
|
}
|