Expressjs-authentication

提供:Dev Guides
移動先:案内検索

ExpressJS-認証

認証とは、提供された資格情報を、ローカルオペレーティングシステムまたは認証サーバー内の承認されたユーザーの情報のデータベースにあるファイル上の資格情報と比較するプロセスです。 資格情報が一致する場合、プロセスは完了し、ユーザーにはアクセスの許可が付与されます。

認証システムを作成するには、サインアップページとユーザーパスワードストアを作成する必要があります。 次のコードは、アカウントを作成してメモリに保存します。 これは、デモのみを目的としています。ユーザー情報の保存には、常に永続的なストレージ(データベースまたはファイル)を使用することをお勧めします。

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);

サインアップフォームの場合、* 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!

localhost:3000/signupにアクセスして、このページが読み込まれるかどうかを確認します。

サインアップフォーム

両方のフィールドに必須属性を設定しているため、HTML5対応ブラウザーでは、IDとパスワードの両方を指定するまでこのフォームを送信できません。 ユーザーIDまたはパスワードなしでcurl要求を使用して登録しようとすると、エラーが表示されます。 次の内容を持つビューで protected_pa​​ge.pug という新しいファイルを作成します-

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

このページは、ユーザーがサインアップまたはログインしたばかりの場合にのみ表示されます。 次に、そのルートと、ログインおよびログアウトするルートを定義しましょう-

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);

ユーザーがサインインしているかどうかを確認するミドルウェア関数_checkSignIn_を作成しました。 protected_pa​​ge はこの関数を使用します。 ユーザーをログアウトするには、セッションを破棄します。

ログインページを作成しましょう。 ビューに login.pug という名前を付けて、内容を入力します-

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

これで、簡単な認証アプリケーションが完成しました。アプリケーションをテストしましょう。 _nodemon index.js_を使用してアプリを実行し、localhost:3000/signupに進みます。

ユーザー名とパスワードを入力し、サインアップをクリックします。 詳細が有効/一意であれば、 protected_pa​​ge にリダイレクトされます-

保護されたページ

次に、アプリからログアウトします。 これにより、ログインページにリダイレクトされます-

認証ログイン

このルートは保護されているため、認証されていないユーザーがアクセスしようとすると、ログインページにリダイレクトされます。 これはすべて基本的なユーザー認証についてでした。 永続セッションシステムを使用し、パスワード転送にハッシュを使用することを常にお勧めします。 JSONトークンを利用して、ユーザーを認証するより良い方法が今あります。