Inhaltsverzeichnis
Willkommen bei der rollenbasierten MERN-Authentifizierung
Heim Web-Frontend js-Tutorial Rollenbasierte Authentifizierung im MERN Stack: Ein vollständiger Leitfaden

Rollenbasierte Authentifizierung im MERN Stack: Ein vollständiger Leitfaden

Jan 10, 2025 pm 10:39 PM

Role-Based Authentication in MERN Stack: A Complete Guide

Authentifizierung ist ein entscheidender Aspekt von Webanwendungen und stellt sicher, dass nur autorisierte Benutzer auf bestimmte Ressourcen zugreifen können. Die rollenbasierte Authentifizierung (RBAC) geht noch einen Schritt weiter, indem sie Benutzern basierend auf ihren Rollen unterschiedliche Berechtigungen zuweist.

In diesem Beitrag behandeln wir Folgendes:
✅ Was ist rollenbasierte Authentifizierung?
✅ Warum rollenbasierte Authentifizierung verwenden?
✅ So implementieren Sie RBAC in einer MERN-Stack-Anwendung

Was ist rollenbasierte Authentifizierung?
Rollenbasierte Zugriffskontrolle (RBAC) ist ein Sicherheitsansatz, bei dem Benutzern Rollen zugewiesen werden und jede Rolle über spezifische Berechtigungen verfügt.

Zum Beispiel in einer E-Commerce-Anwendung:

Der Administrator kann Produkte hinzufügen, bearbeiten oder löschen.
Der Verkäufer kann seine eigenen Produkte verwalten.
Der Kunde kann Produkte nur ansehen und kaufen.
Dadurch wird sichergestellt, dass Benutzer nur Aktionen ausführen können, die für ihre Rollen relevant sind.

Warum rollenbasierte Authentifizierung verwenden?
✔ Erhöhte Sicherheit – Verhindert unbefugten Zugriff auf sensible Vorgänge.
✔ Skalierbarkeit – Fügen Sie ganz einfach neue Rollen und Berechtigungen hinzu, wenn das System wächst.
✔ Bessere Benutzerverwaltung – Weisen Sie Berechtigungen zu, ohne den Code zu ändern.

Wie implementiert man RBAC in einer MERN-Stack-Anwendung?
1️⃣ Einrichten des Benutzermodells (MongoDB Mongoose)
In Ihren models/user.model.js:

Javascript
Code kopieren
const mongoose = require("mongoose");

const UserSchema = new mongoose.Schema({
Benutzername: { Typ: String, erforderlich: wahr, eindeutig: wahr },
E-Mail: { Typ: String, erforderlich: wahr, eindeutig: wahr },
Passwort: { Typ: String, erforderlich: wahr },
Rolle: {
Typ: String,
Aufzählung: ["admin", "verkäufer", "kunde"],
Standard: „Kunde“
}
});

module.exports = mongoose.model("User", UserSchema);
? Hier hat jeder Benutzer ein Rollenfeld, das seine Berechtigungen festlegt.

2️⃣ Generieren von JWT-Tokens zur Authentifizierung
In Ihren Controllern/auth.controller.js:

Javascript
Code kopieren
const jwt = require("jsonwebtoken");
const User = require("../models/user.model");

const login = async (req, res) => {
const { E-Mail, Passwort } = req.body;
const user = waiting User.findOne({ email });

if (!user || user.password !== Passwort) {
return res.status(401).json({ message: „Invalid credentials“ });
}

const token = jwt.sign({ userId: user._id, Role: user.role }, "SECRET_KEY", { ExpiresIn: "1h" });

res.json({ token, role: user.role });
};

module.exports = { login };
? Diese Funktion generiert ein JWT-Token, das die Rolle des Benutzers enthält.

3️⃣ Middleware erstellen, um den Zugriff einzuschränken
In middlewares/auth.middleware.js:

Javascript
Code kopieren
const jwt = require("jsonwebtoken");

const Authenticate = (req, res, next) => {
const token = req.header("Authorization")?.split(" ")[1];

if (!token) return res.status(403).json({ message: "Access denied" });

Versuchen Sie es mit {
const decoded = jwt.verify(token, "SECRET_KEY");
req.user = dekodiert;
next();
} Catch (err) {
res.status(401).json({ message: „Invalid token“ });
}
};

constauthorize = (roles) => {
return (req, res, next) => {
if (!roles.includes(req.user.role)) {
return res.status(403).json({ message: "Forbidden" });
}
next();
};
};

module.exports = { authentifizieren, autorisieren };
? Authentifizieren – Stellt sicher, dass nur angemeldete Benutzer auf Routen zugreifen können.
? autorisieren – Beschränkt den Zugriff basierend auf Rollen.

4️⃣ Routen basierend auf Benutzerrollen schützen
In Routen/admin.routes.js:

Javascript
Code kopieren
const express = require("express");
const { Authenticate, Authorize } = require("../middlewares/auth.middleware");

const router = express.Router();

router.get("/admin-dashboard", Authenticate, Authorize(["admin"]), (req, res) => {
res.json({ message: „Willkommen im Admin-Dashboard“ });
});

module.exports = router;
? Nur Benutzer mit der Administratorrolle können auf /admin-dashboard zugreifen.

5️⃣ Rollenbasierte Benutzeroberfläche in React implementieren
In App.js (Frontend):

Javascript
Code kopieren
import { useState, useEffect } from „react“;
Axios aus „axios“ importieren;

const App = () => {
const [role, setRole] = useState(null);

useEffect(() => {
const token = localStorage.getItem("token");
if (Token) {
const decoded = JSON.parse(atob(token.split(".")[1]));
setRole(decoded.role);
}
}, []);

zurück (


Willkommen bei der rollenbasierten MERN-Authentifizierung


{role === "admin" && Admin-Dashboard}
{role === "seller" && Verkäufer-Dashboard}
{role === "customer" && Kunden-Dashboard}

);
};

Standard-App exportieren;
? Die Benutzeroberfläche zeigt je nach Rolle des Benutzers verschiedene Dashboards an.

Fazit
Die rollenbasierte Authentifizierung ist eine wesentliche Sicherheitsmaßnahme in modernen Webanwendungen. Durch die Implementierung von RBAC im MERN Stack können Sie Benutzerberechtigungen effizient steuern.

? Nächste Schritte:
? Fügen Sie ein Rollenverwaltungsfenster für Administratoren hinzu.
? Implementieren Sie eine Datenbankverschlüsselung für Passwörter.
? Verwenden Sie Aktualisierungstoken für mehr Sicherheit.

Möchten Sie mehr erfahren? Schreiben Sie Ihre Fragen in die Kommentare! ?

Das obige ist der detaillierte Inhalt vonRollenbasierte Authentifizierung im MERN Stack: Ein vollständiger Leitfaden. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

Video Face Swap

Video Face Swap

Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Was soll ich tun, wenn ich auf den Codendruck auf Kleidungsstücke für Front-End-Thermalpapier-Quittungen stoße? Was soll ich tun, wenn ich auf den Codendruck auf Kleidungsstücke für Front-End-Thermalpapier-Quittungen stoße? Apr 04, 2025 pm 02:42 PM

Häufig gestellte Fragen und Lösungen für das Ticket-Ticket-Ticket-Ticket in Front-End im Front-End-Entwicklungsdruck ist der Ticketdruck eine häufige Voraussetzung. Viele Entwickler implementieren jedoch ...

Entmystifizieren JavaScript: Was es tut und warum es wichtig ist Entmystifizieren JavaScript: Was es tut und warum es wichtig ist Apr 09, 2025 am 12:07 AM

JavaScript ist der Eckpfeiler der modernen Webentwicklung. Zu den Hauptfunktionen gehören eine ereignisorientierte Programmierung, die Erzeugung der dynamischen Inhalte und die asynchrone Programmierung. 1) Ereignisgesteuerte Programmierung ermöglicht es Webseiten, sich dynamisch entsprechend den Benutzeroperationen zu ändern. 2) Die dynamische Inhaltsgenerierung ermöglicht die Anpassung der Seiteninhalte gemäß den Bedingungen. 3) Asynchrone Programmierung stellt sicher, dass die Benutzeroberfläche nicht blockiert ist. JavaScript wird häufig in der Webinteraktion, der einseitigen Anwendung und der serverseitigen Entwicklung verwendet, wodurch die Flexibilität der Benutzererfahrung und die plattformübergreifende Entwicklung erheblich verbessert wird.

Wer bekommt mehr Python oder JavaScript bezahlt? Wer bekommt mehr Python oder JavaScript bezahlt? Apr 04, 2025 am 12:09 AM

Es gibt kein absolutes Gehalt für Python- und JavaScript -Entwickler, je nach Fähigkeiten und Branchenbedürfnissen. 1. Python kann mehr in Datenwissenschaft und maschinellem Lernen bezahlt werden. 2. JavaScript hat eine große Nachfrage in der Entwicklung von Front-End- und Full-Stack-Entwicklung, und sein Gehalt ist auch beträchtlich. 3. Einflussfaktoren umfassen Erfahrung, geografische Standort, Unternehmensgröße und spezifische Fähigkeiten.

Wie kann man Parallax -Scrolling- und Element -Animationseffekte wie die offizielle Website von Shiseido erzielen?
oder:
Wie können wir den Animationseffekt erzielen, der von der Seite mit der Seite mit der offiziellen Website von Shiseido begleitet wird? Wie kann man Parallax -Scrolling- und Element -Animationseffekte wie die offizielle Website von Shiseido erzielen? oder: Wie können wir den Animationseffekt erzielen, der von der Seite mit der Seite mit der offiziellen Website von Shiseido begleitet wird? Apr 04, 2025 pm 05:36 PM

Diskussion über die Realisierung von Parallaxe -Scrolling- und Elementanimationseffekten in diesem Artikel wird untersuchen, wie die offizielle Website der Shiseeido -Website (https://www.shiseeido.co.jp/sb/wonderland/) ähnlich ist ...

Ist JavaScript schwer zu lernen? Ist JavaScript schwer zu lernen? Apr 03, 2025 am 12:20 AM

JavaScript zu lernen ist nicht schwierig, aber es ist schwierig. 1) Verstehen Sie grundlegende Konzepte wie Variablen, Datentypen, Funktionen usw. 2) Beherrschen Sie die asynchrone Programmierung und implementieren Sie sie durch Ereignisschleifen. 3) Verwenden Sie DOM -Operationen und versprechen Sie, asynchrone Anfragen zu bearbeiten. 4) Vermeiden Sie häufige Fehler und verwenden Sie Debugging -Techniken. 5) Die Leistung optimieren und Best Practices befolgen.

Die Entwicklung von JavaScript: Aktuelle Trends und Zukunftsaussichten Die Entwicklung von JavaScript: Aktuelle Trends und Zukunftsaussichten Apr 10, 2025 am 09:33 AM

Zu den neuesten Trends im JavaScript gehören der Aufstieg von Typenkripten, die Popularität moderner Frameworks und Bibliotheken und die Anwendung der WebAssembly. Zukunftsaussichten umfassen leistungsfähigere Typsysteme, die Entwicklung des serverseitigen JavaScript, die Erweiterung der künstlichen Intelligenz und des maschinellen Lernens sowie das Potenzial von IoT und Edge Computing.

Wie fusioniere ich Arrayelemente mit derselben ID mit JavaScript in ein Objekt? Wie fusioniere ich Arrayelemente mit derselben ID mit JavaScript in ein Objekt? Apr 04, 2025 pm 05:09 PM

Wie fusioniere ich Array -Elemente mit derselben ID in ein Objekt in JavaScript? Bei der Verarbeitung von Daten begegnen wir häufig die Notwendigkeit, dieselbe ID zu haben ...

Zustand Asynchron Operation: Wie können Sie den neuesten Zustand von Usestore sicherstellen? Zustand Asynchron Operation: Wie können Sie den neuesten Zustand von Usestore sicherstellen? Apr 04, 2025 pm 02:09 PM

Datenaktualisierungsprobleme in Zustand Asynchronen Operationen. Bei Verwendung der Zustand State Management Library stoßen Sie häufig auf das Problem der Datenaktualisierungen, die dazu führen, dass asynchrone Operationen unzeitgemäß sind. � ...

See all articles