Sails.js Tutorial : 로그인/로그아웃 처리하기


  • 명색이 관리자 화면인데, 아무나 들어와서 조작하면 안되겠지요? 이제는 마지막으로 로그인/로그아웃 처리를 해보겠습니다. 로그인/로그아웃은 세션을 이용해서 구현합니다.
  • 로그인 화면을 구성합니다. xyz/views/mgmt/index.ejs을 수정합니다.
    <!DOCTYPE html>
    <html lang="ko">
    <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Login</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
    </head>
    <body>
     
    <div class="container" style="margin-top: 20px">
      <form action="/mgmt/login" method="post" class="form-horizontal" style="margin: 0 auto; max-width: 360px;">
        <input type='hidden' name='_csrf' value='<%= _csrf %>'>
        <div class="form-group">
          <label for="userid" class="col-sm-3 control-label">아이디</label>
          <div class="col-sm-9">
            <input type="text" id="userid" name="userid" class="form-control" placeholder="당신의 ID를 입력하세요..." required autofocus>
          </div>
        </div>
        <div class="form-group">
          <label for="passwd" class="col-sm-3 control-label">비밀번호</label>
          <div class="col-sm-9">
            <input type="password" id="passwd" name="passwd" class="form-control" placeholder="비밀번호를 입력하세요..." required>
          </div>
        </div>
        <input type="submit" class="btn btn-primary btn-block" value="로그인" />
      </form>
    </div>
     
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
    </body>
    </html>
  • xyz/api/models/Admin.js 에 다음을 추가합니다.
    ...
     
      isMember: function(userid, password, cb) {
        const enc_passwd = crypto.createHash('sha256').update(password).digest('base64');
        Admin.count({userid: userid, password: enc_passwd}).exec(function (err, cnt) {
          let is_member = false;
          if (cnt != 0) {
            is_member = true;
          }
          cb(err, is_member);
        });
      },
     
    ...
  • xyz/api/controllers/mgmt/MainController.js 에 다음을 추가한다.
    ...
     
      // 로그인
      login: function (req, res) {
        let userid = req.body.userid;
        let passwd = req.body.passwd;
     
        Admin.isMember(userid, passwd, function (err, is_member) {
          if (is_member == true) {
            req.session.mgmt_login = true;
            res.redirect('/mgmt/admin');
            return;
          }
     
          res.redirect('/mgmt');
        });
      },
     
    ...
  • xyz/config/routes.js 에 다음을 추가한다.
    ...
     
      'post /mgmt/login' : 'mgmt/MainController.login',
     
    ...
  • xyz/views/mgmt/admin/index.ejs 에 다음을 적당한 곳에 추가한다.
    ...
     
    <a href="/mgmt/logout">[로그아웃]</a>
     
    ...
  • xyz/api/controllers/mgmt/MainController.js 에 다음을 추가한다.
    ...
     
      // 로그아웃
      logout: function (req, res) {
        req.session.mgmt_login = undefined;
        res.redirect('/mgmt');
      },
     
    ...
  • xyz/config/routes.js 에 다음을 추가한다.
    ...
     
      'get  /mgmt/logout' : 'mgmt/MainController.logout',
     
    ...
    이제, 로그인도 해보고, 로그아웃도 해보세요. ^^
  • isAdminLoggedIn Policy 를 생성한다. xyz/api/policies/isAdminLoggedIn.js 내용은 아래와 같이 작성한다.
    /**
     * isAdminLoggedIn
     */
    module.exports = function(req, res, next) {
     
      if (req.session.mgmt_login) {
        return next();
      }
     
      res.redirect('/mgmt');
    };
  • xyz/config/policies.js 에 다음 내용을 추가한다.
    ...
     
      'mgmt/MainController': {
        '*': true,
      },
     
      'mgmt/AdminController': {
        '*': 'isAdminLoggedIn',
      },
     
    ...

댓글

이 블로그의 인기 게시물

야마하 디지털 피아노 YDP-140

테이블위로 마우스 커서 이동시 색깔 변경하기

피아노 연습