ExpressJS - Authentifizierung

Die Authentifizierung ist ein Prozess, bei dem die angegebenen Anmeldeinformationen mit denen verglichen werden, die in einer Datenbank mit Informationen autorisierter Benutzer auf einem lokalen Betriebssystem oder auf einem Authentifizierungsserver gespeichert sind. Wenn die Anmeldeinformationen übereinstimmen, ist der Vorgang abgeschlossen und der Benutzer erhält die Berechtigung zum Zugriff.

Damit wir ein Authentifizierungssystem erstellen können, müssen wir eine Anmeldeseite und einen Benutzerkennwortspeicher erstellen. Der folgende Code erstellt ein Konto für uns und speichert es im Speicher. Dies ist nur zum Zweck der Demo; Es wird empfohlen, immer einen dauerhaften Speicher (Datenbank oder Dateien) zum Speichern von Benutzerinformationen zu verwenden.

var express = require('express');
var app = express();
var bodyParser = require('body-parser');
var multer = require('multer');
var upload = multer(); 
var session = require('express-session');
var cookieParser = require('cookie-parser');

app.set('view engine', 'pug');
app.set('views','./views');

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true })); 
app.use(upload.array());
app.use(cookieParser());
app.use(session({secret: "Your secret key"}));

var Users = [];

app.get('/signup', function(req, res){
   res.render('signup');
});

app.post('/signup', function(req, res){
   if(!req.body.id || !req.body.password){
      res.status("400");
      res.send("Invalid details!");
   } else {
      Users.filter(function(user){
         if(user.id === req.body.id){
            res.render('signup', {
               message: "User Already Exists! Login or choose another user id"});
         }
      });
      var newUser = {id: req.body.id, password: req.body.password};
      Users.push(newUser);
      req.session.user = newUser;
      res.redirect('/protected_page');
   }
});

app.listen(3000);

Erstellen Sie nun für das Anmeldeformular eine neue Ansicht mit dem Namen signup.jade.

SIGNUP.JADE

html
   head
      title Signup
   body
      if(message)
         h4 #{message}
         form(action = "/signup" method = "POST")
         input(name = "id" type = "text" required placeholder = "User ID")
         input(name = "password" type = "password" required placeholder = "Password")
         button(type = "Submit") Sign me up!

Überprüfen Sie, ob diese Seite geladen wird, indem Sie localhost: 3000 / signup besuchen.

Wir haben das erforderliche Attribut für beide Felder festgelegt, sodass HTML5-fähige Browser dieses Formular erst senden können, wenn wir sowohl die ID als auch das Kennwort angeben. Wenn jemand versucht, sich mit einer Curl-Anfrage ohne Benutzer-ID oder Passwort zu registrieren, wird ein Fehler angezeigt. Erstellen Sie eine neue Datei mit dem Namenprotected_page.pug in Ansichten mit folgendem Inhalt -

html
   head
      title Protected page
   body
      div Hey #{id}, How are you doing today?
      div Want to log out?
      div Logout

Diese Seite sollte nur sichtbar sein, wenn der Benutzer sich gerade angemeldet oder angemeldet hat. Definieren wir nun seine Route und auch die Routen zum An- und Abmelden.

var express = require('express');
var app = express();
var bodyParser = require('body-parser');
var multer = require('multer');
var upload = multer(); 
var session = require('express-session');
var cookieParser = require('cookie-parser');

app.set('view engine', 'pug');
app.set('views','./views');

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true })); 
app.use(upload.array());
app.use(cookieParser());
app.use(session({secret: "Your secret key"}));

var Users = [];

app.get('/signup', function(req, res){
   res.render('signup');
});

app.post('/signup', function(req, res){
   if(!req.body.id || !req.body.password){
      res.status("400");
      res.send("Invalid details!");
   } else {
      Users.filter(function(user){
         if(user.id === req.body.id){
            res.render('signup', {
               message: "User Already Exists! Login or choose another user id"});
         }
      });
      var newUser = {id: req.body.id, password: req.body.password};
      Users.push(newUser);
      req.session.user = newUser;
      res.redirect('/protected_page');
   }
});
function checkSignIn(req, res){
   if(req.session.user){
      next();     //If session exists, proceed to page
   } else {
      var err = new Error("Not logged in!");
      console.log(req.session.user);
      next(err);  //Error, trying to access unauthorized page!
   }
}
app.get('/protected_page', checkSignIn, function(req, res){
   res.render('protected_page', {id: req.session.user.id})
});

app.get('/login', function(req, res){
   res.render('login');
});

app.post('/login', function(req, res){
   console.log(Users);
   if(!req.body.id || !req.body.password){
      res.render('login', {message: "Please enter both id and password"});
   } else {
      Users.filter(function(user){
         if(user.id === req.body.id && user.password === req.body.password){
            req.session.user = user;
            res.redirect('/protected_page');
         }
      });
      res.render('login', {message: "Invalid credentials!"});
   }
});

app.get('/logout', function(req, res){
   req.session.destroy(function(){
      console.log("user logged out.")
   });
   res.redirect('/login');
});

app.use('/protected_page', function(err, req, res, next){
console.log(err);
   //User should be authenticated! Redirect him to log in.
   res.redirect('/login');
});

app.listen(3000);

Wir haben eine Middleware-Funktion checkSignIn erstellt , um zu überprüfen, ob der Benutzer angemeldet istprotected_pageverwendet diese Funktion. Um den Benutzer abzumelden, zerstören wir die Sitzung.

Lassen Sie uns nun die Anmeldeseite erstellen. Benennen Sie die Ansicht alslogin.pug und geben Sie den Inhalt ein -

html
   head
      title Signup
   body
      if(message)
         h4 #{message}
         form(action = "/login" method = "POST")
         input(name = "id" type = "text" required placeholder = "User ID")
         input(name = "password" type = "password" required placeholder = "Password")
         button(type = "Submit") Log in

Unsere einfache Authentifizierungsanwendung ist jetzt vollständig. Lassen Sie uns nun die Anwendung testen. Führen Sie die App mit nodemon index.js aus und fahren Sie mit localhost: 3000 / signup fort.

Geben Sie einen Benutzernamen und ein Passwort ein und klicken Sie auf Anmelden. Sie werden zu weitergeleitetprotected_page wenn Details gültig / eindeutig sind -

Melden Sie sich jetzt von der App ab. Dadurch werden wir zur Anmeldeseite weitergeleitet -

Diese Route ist so geschützt, dass eine nicht authentifizierte Person, die versucht, sie zu besuchen, auf unsere Anmeldeseite weitergeleitet wird. Hier ging es um die grundlegende Benutzerauthentifizierung. Es wird immer empfohlen, ein dauerhaftes Sitzungssystem zu verwenden und Hashes für den Kennworttransport zu verwenden. Es gibt jetzt viel bessere Möglichkeiten, Benutzer zu authentifizieren, indem JSON-Token verwendet werden.