Heim > Web-Frontend > js-Tutorial > Beherrschen der sicheren Authentifizierung in Node.js: Anmelden/Abmelden mit bcrypt.js und JWT

Beherrschen der sicheren Authentifizierung in Node.js: Anmelden/Abmelden mit bcrypt.js und JWT

Susan Sarandon
Freigeben: 2025-01-11 14:34:43
Original
576 Leute haben es durchsucht

Stellen Sie sich vor, Sie erstellen eine Webanwendung, die kurz vor dem Start steht. Sie haben die Benutzeroberfläche sorgfältig gestaltet, spannende Funktionen hinzugefügt und dafür gesorgt, dass alles reibungslos läuft. Doch je näher der Veröffentlichungstermin rückt, desto mehr macht Ihnen ein lästiges Problem Sorgen: die Sicherheit. Insbesondere geht es darum, sicherzustellen, dass nur die richtigen Benutzer auf die richtigen Teile Ihrer Anwendung zugreifen können. Hier kommt die Authentifizierung ins Spiel.

Authentifizierung ist der Prozess der Überprüfung, wer ein Benutzer ist, und ein entscheidender Aspekt der Webentwicklung. In der riesigen digitalen Landschaft ist es von größter Bedeutung, sicherzustellen, dass sich Benutzer sicher bei Ihrer Anwendung an- und abmelden können. Ein Ausrutscher und Ihre App könnte anfällig für Angriffe sein und Benutzerdaten gefährden.

Einführung

In diesem Artikel befassen wir uns mit der sicheren Authentifizierung in Node.js, wobei wir bcrypt.js zum Hashen von Passwörtern und JWT-Tokens zum Verwalten von Benutzersitzungen verwenden. Am Ende verfügen Sie über ein solides Verständnis dafür, wie Sie ein starkes Anmelde-/Abmeldesystem implementieren und so die Daten Ihrer Benutzer schützen.

Begeben wir uns also auf die Reise zum Aufbau eines kugelsicheren Authentifizierungssystems, angefangen bei der Einrichtung unserer Umgebung bis hin zur Sicherung unserer Routen mit JWT. Sind Sie bereit, Ihre Node.js-App zu sperren? Fangen wir an.

Einrichten Ihrer Node.js-Projektumgebung

Initialisieren Sie zunächst Ihr Node.js-Projekt mit npm init -y, wodurch eine package.json-Datei mit Standardeinstellungen erstellt wird. Als nächstes installieren Sie wichtige Pakete: Express zum Einrichten des Servers, Mongoose zum Verwalten von MongoDB, Jsonwebtoken zum Umgang mit JWT-Tokens, Bcryptjs zum Hashing von Passwörtern, Dotenv für Umgebungsvariablen, Cors zum Aktivieren der Cross-Origin-Ressourcenfreigabe, Cookie-Parser zum Parsen von Cookies. Fügen Sie schließlich nodemon als Entwicklungsabhängigkeit hinzu, um den Server automatisch neu zu starten, wenn sich der Code ändert.

1.`npm init -y`
2.`npm install express mongoose jsonwebtoken bcryptjs dotenv cors cookie-parser`
3.`npm install nodemon -D`

Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren

Ändern Sie nun die Datei package.json. Fügen Sie Skripte wie meinen Code und Typ hinzu.

"scripts": {
    "dev": "nodemon backend/index.js",
    "start": "node backend/index.js"
  },
"type": "module",

Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren

Grundlegende Servereinrichtung

Als nächstes richten wir einen einfachen Express-Server ein. Erstellen Sie eine Datei mit dem Namen index.js . Dieser Code initialisiert Express und erstellt eine Instanz der Anwendung. Anschließend definieren wir eine Route für die Root-URL („/“), um eingehende HTTP-GET-Anfragen zu verarbeiten. Danach starten wir den Server auf Port 8000, sodass er auf eingehende Anfragen warten kann.

import express from "express";
const app = express();

app.get("/", (req, res) => {
  res.send("Server is ready");
});

app.listen(8000, () => {
  console.log("Server is running on PORT 8000");
});
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren

Einrichten grundlegender Authentifizierungsrouten

Jetzt erstellen wir einen Ordner mit dem Namen „Routen“ und erstellen in diesem Ordner eine neue Datei mit dem Namen authRoute.js und fügen den folgenden Code ein, um die Grundlagen der Routen anzuzeigen.

In diesem Codeausschnitt richten wir mithilfe von Express Routen für verschiedene Authentifizierungsendpunkte ein. Zuerst importieren wir die Express-Bibliothek und erstellen eine neue Router-Instanz. Anschließend definieren wir drei GET-Routen: /signup, /login und /logout, die jeweils mit einem JSON-Objekt antworten, das angibt, dass der jeweilige Endpunkt erreicht wurde. Abschließend exportieren wir die Router-Instanz als Standardexport und stellen sie so für die Verwendung in anderen Teilen der Anwendung zur Verfügung.

1.`npm init -y`
2.`npm install express mongoose jsonwebtoken bcryptjs dotenv cors cookie-parser`
3.`npm install nodemon -D`

Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren

Ändern Sie nun die index.js und fügen Sie die Authentifizierungsroute hinzu, um Ihre Endpunkte zu testen.

"scripts": {
    "dev": "nodemon backend/index.js",
    "start": "node backend/index.js"
  },
"type": "module",

Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren

Jetzt können Sie es in Ihrem Browser testen ... aber ich werde der Einfachheit halber Postman verwenden. So können Sie alle Endpunkte testen.

Mastering Secure Authentication in Node.js: Login/Logout with bcrypt.js and JWT

Ähnlich können Sie die anderen Routen wie Abmelden und Anmelden sehen.

So, unsere Basis-App ist fertig ... Machen Sie sie jetzt zu einem robusten und ordnungsgemäßen Authentifizierungssystem.

Erstellen des Benutzermodells mit Mongoose-Schema

Bereiten Sie nun zunächst unsere MongoDB-Datenbank vor. Erstellen Sie dazu einen Ordner „Model“ und darunter eine Datei „User.js“ und fügen Sie in dieser Datei das Mongoose-Schema und das Modell für einen Benutzer in einer MongoDB-Datenbank hinzu. Das Schema umfasst Felder für Benutzername, vollständigen Namen, Passwort und E-Mail, jeweils mit angegebenen Datentypen und Einschränkungen wie Eindeutigkeit und erforderlichem Status. Das Passwortfeld hat ebenfalls eine Mindestlänge von 6 Zeichen.

import express from "express";
const app = express();

app.get("/", (req, res) => {
  res.send("Server is ready");
});

app.listen(8000, () => {
  console.log("Server is running on PORT 8000");
});
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren

Mit Mongoose eine Verbindung zu MongoDB herstellen

Jetzt verbinden wir uns mit unserer Datenbank. Wir erstellen einen Ordner namens db und darin eine Datei namens connectDB.js. In dieser Datei definieren wir eine asynchrone Funktion connectMongoDB, die versucht, mithilfe von Mongoose eine Verbindung zu einer MongoDB-Datenbank herzustellen. Die Datenbankverbindungszeichenfolge wird aus der Umgebungsvariablen MONGO_URI abgerufen. Wenn die Verbindung erfolgreich ist, wird eine Erfolgsmeldung mit dem Hostnamen protokolliert. Wenn dies fehlschlägt, wird der Fehler protokolliert und der Prozess mit dem Statuscode 1 beendet. Die Funktion wird zur Verwendung in anderen Teilen der Anwendung exportiert.

import express from "express";

// Create a new Express router instance
const router = express.Router();

// Define a GET route for the signup endpoint
router.get("/signup", (req, res) => {
  // Return a JSON response indicating that the signup endpoint was hit
  res.json({
    data: "You hit signup endpoint",
  });
});

// Define a GET route for the login endpoint
router.get("/login", (req, res) => {
  // Return a JSON response indicating that the login endpoint was hit
  res.json({
    data: "You hit login endpoint",
  });
});

// Define a GET route for the logout endpoint
router.get("/logout", (req, res) => {
  // Return a JSON response indicating that the logout endpoint was hit
  res.json({
    data: "You hit logout endpoint",
  });
});

// Export the router instance as the default export
export default router;
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren

Um MONGO_URI nun verwenden zu können, müssen wir es in einer .env-Datei erstellen. Hier habe ich die lokale MongoDB-Setup-Verbindungszeichenfolge verwendet. Wenn Sie möchten, können Sie auch den MongoDB-Atlas verwenden.

import express from "express";
import authRoute from "./routes/authRoutes.js";
const app = express();

app.get("/", (req, res) => {
  res.send("Server is ready");
});

app.use("/api/auth", authRoute);

app.listen(8000, () => {
  console.log("Server is running on PORT 8000");
});
Nach dem Login kopieren
Nach dem Login kopieren

Anmeldefunktion

Jetzt führen Sie die Anmeldefunktion durch. Erstellen Sie dazu zunächst einen Ordner Controller und dort die Datei authController.js

import mongoose from "mongoose";

// Define the User schema with various fields and their data types
const userSchema = new mongoose.Schema(
  {
    // The unique username of the user
    username: {
      type: String,
      required: true,
      unique: true,
    },
    fullName: {
      type: String,
      required: true,
    },
    // The password of the user (min length: 6)
    password: {
      type: String,
      required: true,
      minLength: 6,
    },
    // The email of the user (unique)
    email: {
      type: String,
      required: true,
      unique: true,
    },
  },
  { timestamps: true }
);

// Create the User model based on the userSchema
const User = mongoose.model("User", userSchema);

// Export the User model
export default User;
Nach dem Login kopieren

Zunächst werden der vollständige Name, der Benutzername, die E-Mail-Adresse und das Passwort aus dem Anfragetext extrahiert. Es validiert das E-Mail-Format mithilfe eines regulären Ausdrucks und gibt den Status 400 zurück, wenn das Format ungültig ist.

Als nächstes prüft die Funktion, ob der Benutzername oder die E-Mail-Adresse bereits in der Datenbank vorhanden ist. Wenn einer von beiden verwendet wird, wird ein 400-Status mit einer Fehlermeldung zurückgegeben. Es stellt außerdem sicher, dass das Passwort mindestens 6 Zeichen lang ist, und sendet weitere 400 Status, wenn diese Bedingung nicht erfüllt ist.

Das Passwort wird dann mit bcrypt sicher gehasht. Mit den bereitgestellten Daten wird eine neue Benutzerinstanz erstellt und in der Datenbank gespeichert.

Nach dem Speichern generiert die Funktion ein JWT-Token, legt es als Cookie fest und gibt einen 201-Status mit der Benutzer-ID, dem vollständigen Namen, dem Benutzernamen und der E-Mail-Adresse zurück. Wenn Fehler auftreten, werden diese protokolliert und ein 500-Status mit der Meldung „Interner Serverfehler“ gesendet.

Um diese Funktion zu aktivieren, müssen Sie diese importieren

1.`npm init -y`
2.`npm install express mongoose jsonwebtoken bcryptjs dotenv cors cookie-parser`
3.`npm install nodemon -D`

Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren

Ist Ihnen etwas aufgefallen? ein neues Ding namens generateTokenAndSetCookie ... sehen wir uns seinen Code an ... erstellen Sie einen Ordner utils und dort genericTokenAndSetCookie.js.

"scripts": {
    "dev": "nodemon backend/index.js",
    "start": "node backend/index.js"
  },
"type": "module",

Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren

Die Funktion **generateTokenAndSetCookie **erstellt ein JWT und speichert es in einem Cookie zur Benutzerauthentifizierung.

JWT-Generierung:

Die Funktion verwendet die jsonwebtoken-Bibliothek, um ein JWT zu erstellen. Es signiert das Token mit der Benutzer-ID und einem geheimen Schlüssel (JWT_SECRET aus den Umgebungsvariablen) und legt es so fest, dass es in 15 Tagen abläuft.

Cookie setzen:

Das Token wird dann in einem Cookie im Browser des Benutzers gespeichert. Das Cookie ist mit mehreren Sicherheitsattributen konfiguriert:

  • maxAge: Legt die Lebensdauer des Cookies auf 15 Tage fest.
  • httpOnly: Stellt sicher, dass das Cookie nicht über JavaScript zugänglich ist, und schützt so vor XSS-Angriffen (Cross-Site Scripting).
  • sameSite: „strict“: Verhindert CSRF-Angriffe (Cross-Site Request Forgery), indem das Senden des Cookies nur bei Anfragen von derselben Site eingeschränkt wird.
  • sicher: Stellt sicher, dass das Cookie nur dann über HTTPS gesendet wird, wenn es sich bei der Umgebung nicht um eine Entwicklungsumgebung handelt, wodurch eine zusätzliche Sicherheitsebene hinzugefügt wird.

Diese Funktion stellt also sicher, dass die Sitzung des Benutzers sowohl sicher als auch dauerhaft ist, was sie zu einem entscheidenden Teil des Authentifizierungsprozesses macht.

Hier müssen wir eine weitere Umgebungsvariable JWT_SECRET in .env hinzufügen. Sie können jede Art von Mischung aus Zahlen und Zeichenfolgen wie folgt hinzufügen.

import express from "express";
const app = express();

app.get("/", (req, res) => {
  res.send("Server is ready");
});

app.listen(8000, () => {
  console.log("Server is running on PORT 8000");
});
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren

Jetzt ist unsere Anmeldefunktion abgeschlossen. Erstellen Sie jetzt die Route.

import express from "express";

// Create a new Express router instance
const router = express.Router();

// Define a GET route for the signup endpoint
router.get("/signup", (req, res) => {
  // Return a JSON response indicating that the signup endpoint was hit
  res.json({
    data: "You hit signup endpoint",
  });
});

// Define a GET route for the login endpoint
router.get("/login", (req, res) => {
  // Return a JSON response indicating that the login endpoint was hit
  res.json({
    data: "You hit login endpoint",
  });
});

// Define a GET route for the logout endpoint
router.get("/logout", (req, res) => {
  // Return a JSON response indicating that the logout endpoint was hit
  res.json({
    data: "You hit logout endpoint",
  });
});

// Export the router instance as the default export
export default router;
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren

OK, jetzt ändern wir unsere index.js. Hier haben wir einige neue Importe hinzugefügt. dotenv: Lädt Umgebungsvariablen sicher aus .env; express.json(): Analysiert eingehende JSON-Anfragen; express.urlencoded({ erweitert: true }): Analysiert URL-codierte Daten; cookieParser: Verarbeitet Cookies für JWT-Tokens; connectMongoDB(): Stellt eine Verbindung zu MongoDB zur Datenspeicherung her; Routen: /api/auth verwaltet die Anmeldung, Anmeldung und Abmeldung.

Hier ist der aktualisierte Code von index.js

1.`npm init -y`
2.`npm install express mongoose jsonwebtoken bcryptjs dotenv cors cookie-parser`
3.`npm install nodemon -D`

Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren

Also. Jetzt ist es an der Zeit, unsere Anmeldefunktion in Postman zu testen. Mal sehen, ob es funktioniert oder nicht.

Hier sind also die Ergebnisse.

Mastering Secure Authentication in Node.js: Login/Logout with bcrypt.js and JWT

Hier können Sie sehen, dass es ordnungsgemäß funktioniert, und Sie können es auch in Ihrer MongoDB-Datenbank überprüfen.

Mastering Secure Authentication in Node.js: Login/Logout with bcrypt.js and JWT

Login-Funktion

Führen Sie nun die Login-Funktion durch. Gehen wir noch einmal zu unserer Datei authController.js

"scripts": {
    "dev": "nodemon backend/index.js",
    "start": "node backend/index.js"
  },
"type": "module",

Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren

Der Login-Controller authentifiziert einen Benutzer, indem er seinen Benutzernamen und sein Passwort überprüft. Zunächst wird anhand des Benutzernamens in der Datenbank nach dem Benutzer gesucht. Wenn es gefunden wird, vergleicht es das bereitgestellte Passwort mit dem mit bcrypt in der Datenbank gespeicherten Hash-Passwort. Wenn der Benutzername oder das Passwort falsch ist, wird eine Fehlerantwort zurückgegeben. Bei erfolgreicher Überprüfung generiert es ein JWT-Token, legt es mit „generateTokenAndSetCookie“ als Cookie fest und antwortet mit einer Erfolgsmeldung, die angibt, dass der Benutzer erfolgreich angemeldet ist.

Fügen wir unsere Anmelderoute in authRoutes.js hinzu

import express from "express";
const app = express();

app.get("/", (req, res) => {
  res.send("Server is ready");
});

app.listen(8000, () => {
  console.log("Server is running on PORT 8000");
});
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren

Lassen Sie es uns in Postman testen.

Mastering Secure Authentication in Node.js: Login/Logout with bcrypt.js and JWT
Hier können Sie sehen, dass „Angemeldet“ erfolgreich angezeigt wird.

Logout-Funktion

Okay. Jetzt die letzte Funktion, nämlich die Abmeldefunktion. Lassen Sie uns das umsetzen. Es ist ziemlich einfach.

import express from "express";

// Create a new Express router instance
const router = express.Router();

// Define a GET route for the signup endpoint
router.get("/signup", (req, res) => {
  // Return a JSON response indicating that the signup endpoint was hit
  res.json({
    data: "You hit signup endpoint",
  });
});

// Define a GET route for the login endpoint
router.get("/login", (req, res) => {
  // Return a JSON response indicating that the login endpoint was hit
  res.json({
    data: "You hit login endpoint",
  });
});

// Define a GET route for the logout endpoint
router.get("/logout", (req, res) => {
  // Return a JSON response indicating that the logout endpoint was hit
  res.json({
    data: "You hit logout endpoint",
  });
});

// Export the router instance as the default export
export default router;
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren

Der Logout-Controller meldet einen Benutzer sicher ab, indem er das JWT-Cookie mithilfe von res.cookie aus dem Browser des Clients löscht, seinen Wert auf eine leere Zeichenfolge und sein maxAge auf 0 setzt, um einen sofortigen Ablauf sicherzustellen. Nach erfolgreicher Cookie-Löschung wird eine Erfolgsantwort mit einer Meldung gesendet, die angibt, dass der Benutzer erfolgreich abgemeldet wurde. Wenn während dieses Vorgangs ein Fehler auftritt, wird der Fehler abgefangen, protokolliert und eine interne Serverfehlerantwort zurückgegeben.

Fügen Sie diese Route zu unserem authRoute.js hinzu

import express from "express";
import authRoute from "./routes/authRoutes.js";
const app = express();

app.get("/", (req, res) => {
  res.send("Server is ready");
});

app.use("/api/auth", authRoute);

app.listen(8000, () => {
  console.log("Server is running on PORT 8000");
});
Nach dem Login kopieren
Nach dem Login kopieren

Okay. Testen wir unsere letzte Funktion, ob sie gut funktioniert oder nicht.

Mastering Secure Authentication in Node.js: Login/Logout with bcrypt.js and JWT

Oh!…Es funktioniert super gut. ??

Jetzt ist unser komplettes Backend dieser Authentifizierung fertig. ??

Mein npm-Paket

Wenn Sie nicht alles selbst codieren möchten und eine schnelle Lösung wünschen, habe ich ein npm-Paket namens auth0_package erstellt. Sie können es hier erhalten.

Github-Repository

Sie können meinen gesamten oben genannten Code hier in diesem Github-Repo erhalten.

Jetzt ist Ihre Backend-Anwendung fertig. Im nächsten Blog werde ich erklären, wie Sie dies in Ihr Frontend integrieren. Also bleiben Sie dran ??.

Abschluss

Zusammenfassend lässt sich sagen, dass die Implementierung einer sicheren Authentifizierung in einer Node.js-Anwendung von entscheidender Bedeutung ist, um Benutzerdaten zu schützen und sicherzustellen, dass nur autorisierte Benutzer auf bestimmte Teile Ihrer Anwendung zugreifen können. Durch die Verwendung von bcrypt.js für das Passwort-Hashing und JWT-Tokens für die Sitzungsverwaltung können Sie ein robustes Anmelde-/Abmeldesystem erstellen. Dieser Ansatz erhöht nicht nur die Sicherheit, sondern sorgt auch für ein nahtloses Benutzererlebnis. Durch die Einrichtung einer MongoDB-Datenbank und die Verwendung von Express für das Routing wird die Backend-Infrastruktur weiter gestärkt. Mit diesen Tools und Techniken können Sie Ihre Webanwendung sicher starten und wissen, dass sie gut vor unbefugtem Zugriff und potenziellen Sicherheitsbedrohungen geschützt ist.

Das obige ist der detaillierte Inhalt vonBeherrschen der sicheren Authentifizierung in Node.js: Anmelden/Abmelden mit bcrypt.js und JWT. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:dev.to
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
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage